1. 程式人生 > >data-屬性的作用

data-屬性的作用

data-屬性用於儲存私有的自定義資料,data-屬性可以讓我們在所有html元素上增加自定義data屬性,儲存的data屬效能被JavaScript呼叫。
data-屬性不應該包含任何大寫字母,並且在data-後必須最少擁有一個字元,屬性值可以是任意字串

取值方法:
// getAttribute
var id = document.getElementById('id');
var data = id.getAttribute(‘data-xxx’);

// dataset
var id = document.getElementById('id');
id.dataset.xxx; //取值
id.dataset.xxx = 'xxx'; //賦值
id.dataset.xxx2 = 'xxx2'; //新增
delete id.dataset.xxx; //刪除

// JQuery data
var data = $('#id').data('xxx'); //取值
$('#id').data('xxx','xxx1'); //賦值 新增
$('#id').removeData('xxx'); //刪除

// JQuery attr
var data = $('#id').attr('data-xxx'); //取值
$('#id').attr('data-xxx','xxx1'); //賦值 新增
$('#id').removeAttr('data-xxx'); //刪除