题主可能误解了data的用法, 题主可以试着看看jquery的源码中data的封装:data

很明显的表明$(element).data(); 是需要html标签中已经存在如这样的<p data-name="xxx"></p>,所以题主找不到比较正常。

一般操作的时候,都会在html标签中添加data-name="value",然后再通过jquery去修改

jquery的data方法并不会向attr属性一样,可以直接修改dom的属性。

$("p").attr("data-name","haha")

通过jquery源码可以得知,jquery把属性为data-*的html标签获取到,并取到data-*的value值,放在cache缓存里面,其实质改动的只是data数据而已。并不会修改dom属性。

<p data-name="value"> p's value </p>

$("p").data("name");   // 得到值 value

$("p").data("name","haha");   //改变data值，此时只是在cache里面改变而已，其实质上并没有修改data-name中的value。

// 此时仍然是 <p data-name="value"> p's value </p>, 但通过data获取的值就不是标签中的值了。

$("p").data("name");    //此时得到的值 是haha

//包括之后移除了data-name
$("p").removeAttr("data-name")   // 结果为: [<p>​…​</p>​]

//此时获取
$("p").data("name")  //值依然存在  haha

jQuery的data()方法只是作为数据的一种存取而已.并不修改Dom属性

如果想改变data-name中的值,建议直接用

$("p").attr("data-name","hahaha");

// <p data-name="hahaha"> p's value </p>

另外添加属性,不能通过data的方法,只能通过

$("p").attr("data-name1","value1");
//<p data-name1="value1" data-name="value"></p>

在内存里，不会写到html中

jq在初始化时, 会将代码所有data-*属性读出来, 放到对应jq对象的data里

你用data("a", 1)去修改或添加时, 并不会改变dom的属性值, 因为data是放在内存里的

你用attr("data-a", 1)去修改或添加时, 会改变dom的属性值, 并且还会修改内存里data的值

要使用jq的data, 必须是属性以data-开头