设置、获取和删除数据属性(data-xxx 属性)

读取，写入或删除元素的数据值

---

在JavaScript中，设置元素的数据属性是通过通用的setAttribute方法完成的。 这等效于jQuery的$.data()方法。 以下是设置和检索属性"data-foo"的示例:

// setting data-foo
var el = document.querySelector('div');
el.setAttribute('data-foo', 'Hello World!');
      

getAttribute() 可用于读取元素的数据属性(data-xxx 属性，同dataSet等):

// getting data-foo
var el = document.querySelector('img');
console.log(el.getAttribute('data-foo'));
      

使用用removeAttribute方法删除指定的数据属性：

el.removeAttribute('data-foo');
      

除了设置，获取和删除数据属性之外，这三种方法还用于操纵其他元素属性。