这篇文章主要介绍Javascript如何封装id、class与元素选择器,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
10年积累的成都网站设计、网站制作经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先做网站设计后付款的网站建设流程,更有孝义免费网站建设让你可以放心的选择与我们合作。
由于各个浏览器都支持的选择方法只有如下三种:
1、document.getElementById()
2、document.getElementsByName()
3、document.getElementsByTagName()
所以在封装选择器的时候要考虑浏览器的兼容性。
示例代码如下:
<script>//封装id选择器 function $(selector){ var c=selector.substring(0,1);//获取第一个字符 if(c=="#"){ return document.getElementById(selector.substring(1,selector.length));//返回相应的元素 } } //封装class选择器 function $(selector){ var className=selector.substring(1);//从索引为1的元素往后取 //判断浏览器是否支持getElementsByClassName if(document.getElementsByClassName){ return document.getElementsByClassName(className) //document.querySelectorAll('.cls')兼容性有问题 }else{ //document.getElementsByTagName('*')+正则表达式 //\s空白字符 ^开始 $结束 var reg=new RegExp('^|\\s'+className+'$|\\s'); var elems=document.getElementsByTagName("*");//获取页面中所有元素 var arr=[];//保存获取到的指定className的元素 for(var i=0;i<elems.length;i++){ if(reg.test(elems[i].className)){//如果和模式匹配上 arr.push(elem[i]); } } return arr; } } //封装标签选择器 function $(element){ return document.getElementsByTagName(element); } </script>
以上是“Javascript如何封装id、class与元素选择器”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!
网页标题:Javascript如何封装id、class与元素选择器
分享链接:https://www.cdcxhl.com/article44/igojee.html
成都网站建设公司_创新互联,为您提供营销型网站建设、企业网站制作、网站设计、网站导航、网站内链、App设计
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联