htmlラベル要素のdata-*プロパティについて
5675 ワード
このテーマについての文章やブログは実はもうたくさんあります.ここでは車輪を繰り返すのではなく、いくつかの例を見るのは少し面倒ですが、実は簡単です.しかし、入門したばかりの人にとって、w 3 cの例は読めないかもしれません.ここでは最も簡単な例を挙げて参考にします.
大牛は自然に省略し,指導を惜しまない.
コードは次のとおりです.
これは十分簡単でしょうが、
1.divタグを定義します.属性はdata-nameと呼ばれ、data-は固定され、後の任意です.
2.ブラウザからこの属性の値をポップアップする
大牛は自然に省略し,指導を惜しまない.
コードは次のとおりです.
1 <html>
2 <head>
3 <title>Html5 custom data attribute Test</title>
4 </head>
5 <body >
6 <div class="user" data-name="xiaoan"></div>
7 <script type="text/javascript">
8 var user = document.getElementsByTagName("div")[0];
9 if(isIe()){
// ie
10 alert(user.getAttribute('data-name'));
11 }
12 else{
// ie
13 alert(user.dataset['name']);
14 }
15 // ie， ie10 ie11 ， false，
16 function isIe(){
17 return window.ActiveXObject ? true : false;
18 }
19 </script>
20 </body>
21 </html>これは十分簡単でしょうが、
1.divタグを定義します.属性はdata-nameと呼ばれ、data-は固定され、後の任意です.
2.ブラウザからこの属性の値をポップアップする