【前端】jquery获取data-*的属性值

通过jquery获取下面data-id的值

html 复制代码
<div id="getId" data-id="122" >获取id</div>

方法一:dataset()方法

javascript 复制代码
//data-前缀属性可以在JS中通过dataset取值,更加方便
console.log(getId.dataset.id);//112

//赋值
getId.dataset.id = "113";//113

//新增data属性
getId.dataset.id2 = "100";//100

//删除,设置成null,或者delete
getId.dataset.id2 = null;//null
delete getId.dataset.id2;//undefind

方法二:jquery data()方法

javascript 复制代码
// 取值
var id = $("#getId").data("id"); //122

//赋值
$("#getId").data("id","100");//100

通过点击事件,获取当前被点击的属性值

javascript 复制代码
// 获取当前点击的属性值
$("#getId).click(function(){
    var id= $(this).data('id')
})

方法三:jquery attr()方法

javascript 复制代码
// 取值
var id = $("#getId").attr("data-id"); //122

//赋值
$("#getId").attr("data-id","100");//100
相关推荐
油丶酸萝卜别吃2 小时前
utils.js 说明文档
开发语言·javascript·ecmascript
zyplayer-doc4 小时前
VuePress类静态文档站和动态知识库怎么选:两种技术路线的适用场景
javascript·人工智能·后端·安全·智能手机
紫禁玄科5 小时前
Shai-Hulud:npm生态的自我复制蠕虫风暴
前端·npm·node.js
东风破_6 小时前
后端API没写好,前端难道干等着吗?
前端
用户938515635076 小时前
从前后端分离到前端接口工程:React + MockJS + Vite 解析
前端·后端·全栈
用户938515635076 小时前
从零在浏览器里跑 DeepSeek-R1:WebGPU + Transformers.js 全链路实战(三)
前端·react.js·typescript
excel6 小时前
当前端行情变差,我们为什么还要坚持?
前端
鸿是江边鸟,曾是心上人7 小时前
快速搭建HTTPS本地开发环境
前端
To_OC7 小时前
写了 5 个表单 Demo 后,我终于彻底搞懂了 React 受控与非受控组件
前端·react.js·前端框架
Sterting7 小时前
第9课 Vue Router 路由
前端·vue.js