自定义属性的存在形式

其实就是HTML标签中的data-*属性

作用

自定义数据属性是为了保存页面或者应用程序的私有自定义数据，这些自定义数据属性保存进DOM中，对于整个DOM的布局和表现无任何影响，但是却可以方便操控整个网页的交互以及想要表达的效果。

自定义属性的设置

• 直接在标签中设置：

<span id="test" data-age="21">test</span>

	
	

		1
	

• 通过js设置

var test = document.getElementById('test');
test.dataset.age = "21";

	
	

		1
	

	

		2
	

• 通过jQuery设置

$('test').attr('data-age','21');
或者 $('test').data('age','21');

	
	

		1
	

	

		2
	

	

		3
	

自定义属性的获取

• 使用js获取

var test = document.getElementById('test');
test.dataset.age

	
	

		1
	

	

		2
	

• 使用jQuery获取

$('test').attr('data-age');
或者 $('test').data('age');