jQuery是一種流行的JavaScript庫,它可以快速方便地操作DOM元素。在HTML5中,可以使用data-set屬性給元素添加數據。
<div id="myDiv" data-name="Tom" data-age="25"> <p>My Div</p> </div>
使用jQuery選中data-set屬性的值很簡單。可以使用.attr()方法來獲取data-屬性的值:
var name = $('#myDiv').attr('data-name'); var age = $('#myDiv').attr('data-age'); console.log(name); //"Tom" console.log(age); //25
可以同時選擇多個元素中的data-set屬性:
$('.myClass').each(function() { var name = $(this).attr('data-name'); console.log(name); });
另一種獲取data-set屬性值的方法是使用.data()方法:
var name = $('#myDiv').data('name'); var age = $('#myDiv').data('age'); console.log(name); //"Tom" console.log(age); //25
使用.data()方法要注意的是,這種方法會自動把屬性名稱轉換成駝峰命名的形式,例如data-my-age屬性會被轉換成myAge:
var myAge = $('#myDiv').data('my-age'); console.log(myAge); //25
使用以上方法即可方便地選中元素的data-set屬性。
下一篇css彈出框遮罩層