探索云世界
活动广场
下载
下载
海量开发者使用工具、手册，免费下载
探索云世界
这个data方法不属于javascript,属于jQuery封装的,使用jQuery的.data()方法来访问这些"data-*" 属性。其中一个方法就是 .data(obj)，这个方法是在 jQuery1.4.3版本后出现的，它能返回相应的data属性
这是别人回答的,我试了试,想给div 加个 name 属性,但是我 审查元素的时候,发现 div 并没有增加 name 属性..
怎么回事呢?
这个name 加到哪里去了?
要是让他加到html 中,具体怎么加?
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<style>
</style>
</head>
<body>
<div id="aaa1"> </div>
<div id="aaa2"> </div>
<div id="aaa3" name="★这是原始名,看到本句说明data无效!"> </div>
<div id="aaa4" data-name="★这是原始名,看到本句说明data无效!"> </div>
<div id="aaa5"> </div>
<div id="aaa6"> </div>
<script>
$("#aaa1").data("name","shiyan");
$("#aaa2").data("我用data随便编的属性名","我随便编的值");
$("#aaa3").data("name","这是新名,代码没有显示出来!");
$("#aaa4").data("data-name","这是新名,代码没有显示出来!");
$("#aaa5").attr("name","attr修改的,看到本句说明attr生效!");
$("#aaa6").attr("我用attr随便编的属性名","attr修改的,看到本句,说明attr能自己造一个js中没有的属性.");
</script>
</body>
</html>
写回答
题主可能误解了data的用法, 题主可以试着看看jquery的源码中data的封装:data
很明显的表明$(element).data(); 是需要html标签中已经存在如这样的<div data-name="xxx"></div>,所以题主找不到比较正常。
一般操作的时候,都会在html标签中添加data-name="value",然后再通过jquery去修改
jquery的data方法并不会向attr属性一样,可以直接修改dom的属性。
$("div").attr("data-name","haha")
通过jquery源码可以得知,jquery把属性为data-*的html标签获取到,并取到data-*的value值,放在cache缓存里面,其实质改动的只是data数据而已。并不会修改dom属性。
<div data-name="value"> div's value </div>
$("div").data("name"); // 得到值 value
$("div").data("name","haha"); //改变data值，此时只是在cache里面改变而已，其实质上并没有修改data-name中的value。
// 此时仍然是 <div data-name="value"> div's value </div>, 但通过data获取的值就不是标签中的值了。
$("div").data("name"); //此时得到的值 是haha
//包括之后移除了data-name
$("div").removeAttr("data-name") // 结果为: [<div>…</div>]
//此时获取
$("div").data("name") //值依然存在 haha
jQuery的data()方法只是作为数据的一种存取而已.并不修改Dom属性
如果想改变data-name中的值,建议直接用
$("div").attr("data-name","hahaha");
// <div data-name="hahaha"> div's value </div>
另外添加属性,不能通过data的方法,只能通过
$("div").attr("data-name1","value1");
//<div data-name1="value1" data-name="value"></div>版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
