data-xxx 属性的作用是什么

data-xxx为前端开发者提供了自定义属性

自定义属性可以通过对象的dataset来获取,不支持该属性的浏览器可以通过getAttribute()方法来获取

例子:

  1. // 使用getAttribute获取 data- 属性
  2. var user = document . getElementById ( 'user' ) ;
  3. var userName = plant . getAttribute ( 'data-uname' ) ; // userName = '愚人码头'
  4. var userId = plant . getAttribute ( 'data-uid' ) ; // userId = '12345'
  5.  
  6. // 使用setAttribute设置 data- 属性
  7. user . setAttribute ( 'data-site' , 'http://www.css88.com' ) ;
  8. 还有一点特别注意的是: data- 属性名如果包含了连字符,例如:data-date-of-birth ,连字符将被去掉,并转换为驼峰式的命名,前面的属性名转换后应该是: dateOfBirth 。

猜你喜欢

转载自www.cnblogs.com/liangshuang/p/8990607.html