html5自定义属性:如何获取自定义属性值(附代码)
导读:收集整理的这篇文章主要介绍了html5自定义属性:如何获取自定义属性值(附代码),觉得挺不错的,现在分享给大家,也给大家做个参考。这篇文章给大家介绍的内容是关于htML5自定义属性:如何获取自定义属性值(附代码),有一定的参考价值,有需要的...
收集整理的这篇文章主要介绍了html5自定义属性:如何获取自定义属性值(附代码),觉得挺不错的,现在分享给大家,也给大家做个参考。这篇文章给大家介绍的内容是关于htML5自定义属性:如何获取自定义属性值(附代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。自定义属性:
在HTML5中我们可以自定义属性,其格式如下data-*="",例如:data-info="我是自定义属性",通过Node.dataset['info'] 我们便可以获取到自定义的属性值。
当我们如下格式设置时,则需要以驼峰格式才能正确获取:data-my-name="ITcast",获取Node.dataset['myName']
!DOCTYPE html> html lang="en"> head> meta charset="UTF-8"> title> Title/title> /head> body> !--定义--> !--规范:1.data-开头2.data-后必须至少有一个字符,多个单词使用-连接建议:1.名称应该都使用小写--不要包含任何的大写字符2.名称中不要有任何的特殊符号3.名称不要副作用纯数字--> p data-school-name="itcast"> 传智播客/p> p data-name="itcast"> 传智播客/p> !--取值--> script> window.onload=function(){ VAR p=document.querySelector("p"); /*获取自定义属性值*/ /*将data-后面的单词使用camel命名法连接:必须使用camel合法法获取值否则有可能无法获取到值*/ //var value=p.dataset["schoolname"]; //data-schoolname 就是相当于上面的代码块来着同一个意思来着 var value=p.dataset["schoolName"]; //data-school-name 里面的取值必须第二个单词。的第一个字母必须是大写字母来着 console.LOG(value); } /script> /body> /html>
相关文章推荐:
关于html中label> 标签的for属性的详细分析
html中标签嵌套的问题如何解决
以上就是html5自定义属性:如何获取自定义属性值(附代码)的详细内容,更多请关注其它相关文章!
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: html5自定义属性:如何获取自定义属性值(附代码)
本文地址: https://pptw.com/jishu/584355.html