在JavaScript中利用JQuery插件实现获取数据- *属性值的方法 - 行业资讯

　　介绍

本篇文章给大家分享的是有关在JavaScript中利用JQuery插件实现获取数据- *属性值的方法,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。

下面就详细介绍四种方法获取数据- *属性的值

<代码> & lt;李id=癵etId"数据id=?22”;data-vice-id=?1“祝辞获取id

需要获取的就是数据id和dtat-vice-id的值

<强>一:getAttribute()方法

 const getId=. getelementbyid (& # 39; getId # 39;);////getAttribute()取值属性
　　console.log (getId.getAttribute (“data-id"));//122
　　console.log (getId.getAttribute (“data-vice-id"));//11////setAttribute()赋值属性
　　getId.setAttribute (“data-id"“48“);
　　console.log (getId.getAttribute (“data-id"));//48

<强>二:数据集()方法

//数据-前缀属性可以在js中通过数据集取值,更加方便　　console.log (getId.dataset.id);//112//data-vice-id连接取值使用驼峰命名法取值　　console.log (getId.dataset.viceId);//11//赋值　　getId.dataset。id=?13“;;//113 　　getId.dataset.viceId——;//10//新增数据属性　　getId.dataset。id2=?00“;;//100//删除,设置成空,或者删除　　getId.dataset。id2=零;//null 　　之前删除getId.dataset.id2;//undefind

<强>三:jquery数据()方法

=$ var id (“# getId") . data (“id");//122
　　var viceId=$ (“# getId") . data (“vice-id");//11//赋值
　　$ (“# getId") . data (“id",“100“);//100

jquery数据是一种缓存机制

用法如下:

数据()方法//HTML代码& lt; div id=癿yDiv"data-appid=?23”;data-myname=發sxj"data-app-id=?56”;data-my-name=皊econdname"祝辞& lt;/div>//获取属性　　var appid=$ (“# myDiv") . data (“appid");//123 　　var的应用id=$ (“# myDiv") . data (“app-id");//456//属性赋值$ (“# myDiv") . data (“appid",“666“);//最终HTML代码& lt; div id=癿yDiv"data-appid=?23”;data-myname=發sxj"data-app-id=?56”;data-my-name=皊econdname"祝辞& lt;/div> 　　　　需要注意的是,数据()的值进行修改并不会影响到DOM元素上的数据- *属性的改变. data()的本质其实是将一个“缓存”附加到了对象上,并使用了一个特殊的属性名称。　　　　所以上述代码中,虽然对div进行了数据()赋值操作,但HTML代码中div的data-appid的值仍然为123,因为数据()只是修改了缓存的那个值,此时进行美元(& # 39;# myDiv& # 39;) . data (“appid")的操作,输出的结果为666。

<强>四:jquery attr()方法

=$ var id (“# getId") .attr (“data-id");//122
　　var viceId=$ (“# getId") .attr (“data-vice-id");//11//赋值
　　$ (“# getId") .attr (“data-id",“100“);//100

以上就是在JavaScript中利用JQuery插件实现获取数据- *属性值的方法,小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注行业资讯频道。