zoukankan      html  css  js  c++  java
  • data-*

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="UTF-8">
     5         <title></title>
     6     </head>
     7     <body>
     8         <div id = "user" uid = "12345" data-uname = "愚人码头"  data-date-of-birth> </div>
     9 <script>
    10 // 使用getAttribute获取 data- 属性
    11 var user = document . getElementById ( 'user' ) ;
    12 var userName = user .dataset.uname; // userName = '愚人码头'
    13 var userId = user . getAttribute ( 'uid' ) ; // userId = '12345'
    14  
    15 // 使用setAttribute设置 data- 属性
    16 user . setAttribute ( 'site' , 'http://www.css88.com' ) ;
    17 console.log(1111,userName,userId,user.getAttribute('site'))
    18 
    19 
    20 var dateofbirth = user.dataset.dateOfBirth = '1985-01-05'; // 设置data-date-of-birth的值.
    21 console.log(dateofbirth,"dataset属性只有在Chrome 8+ Firefox(Gecko) 6.0+ Internet Explorer 11+ Opera 11.10+ Safari 6+浏览器中实现")
    22 user.dataset.someDataAttr = 'mydata';//即使不存在的属性一旦挂上去之后就有了,认真脸
    23 console.log('someDataAttr' in user.dataset);//true
    24 
    25 </script>
    26     </body>
    27 </html>
  • 相关阅读:
    JDBC MySQL 实例之 用户管理系统
    利用JDBC连接数据库(MySQL)
    CSS01
    HTML01
    GUI编程02
    GUI编程01
    名词解释
    Navicat MySQL安装
    Eclipse安装Web/JavaEE插件、Eclipse编写HTML代码
    Pascal输出星星
  • 原文地址:https://www.cnblogs.com/lujunan/p/9956975.html
Copyright © 2011-2022 走看看