jQuery中attr和data取值赋值的区别

1：data取值跟attr取值第一次取值流程都是相同的都是去dom中获得值 获取的值是相同的

<button data-type="0" onclick="attr(this)" id="btn">jQuery中attr和data取值赋值的区别</button>
<script type="text/javascript">
	//使用 data 输出初始的值
	console.log($("#btn").data("type"));
	console.log($("#btn").attr("data-type"));
</script>

总结：data多了一个操作那就是把该对象保存到内存中，也就是如果再取值的话，不是从dom中获得而是从内存中读取。就是在获得值之前重新修改了dome的值了，那么data读到的还是之前的数据

2：使用attr改变值

<button data-type="0" onclick="attr(this)" id="btn">jQuery中attr和data取值赋值的区别</button>
<script type="text/javascript">
	//点击按钮 使用attr改变值
	function attr(obj){
		$(obj).attr("data-type","1");
		console.log($(obj).data("type")); //data 获取的值是原始的值 
		console.log($(obj).attr("data-type"));//attr 获取的值是改变之后的值
	}
</script>

总结：大多时候还是使用attr取值赋值比较好一点 如果是不知道data和attr之间的区别的话 可能是对的但是不知道其中的原理导致一直在想什么地方错