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之间的区别的话 可能是对的但是不知道其中的原理导致一直在想什么地方错
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战