推薦一個(gè)封裝好的getElementsByClassName方法
我們知道,原生的JS給我們提供了getElementsByClassName方法,可以通過此方法獲取到含有某指定class的節(jié)點(diǎn)集合,注意是集合,也就是此函數(shù)返回一個(gè)數(shù)組。
但是,IE卻并不支持這個(gè)方法,但這方法卻是很有實(shí)用性,所以,我們又不得不專門為IE實(shí)現(xiàn)這么一個(gè)函數(shù)。
function getElementsByClassName(oEle,sClass,sEle){
if(oEle.getElementsByClassName){
return oEle.getElementsByClassName(sClass);
}else{
var aEle=oEle.getElementsByTagName(sEle || '*'),
reg=new RegExp('(^|\\s)'+sClass+'($|\\s)'),
arr=[],
i=0,
iLen=aEle.length;
for(; i<iLen; i++){
if(reg.test(aEle[i].className)){
arr.push(aEle[i]);
}
}
return arr;
}
}
使用方法:
//第一種:選擇document下的所有class為box_box的div元素
getElementsByClassName(document,'box_box','div')[0].style.background='yellow';
//第二種:選擇document下的所有class為box-box的div元素
getElementsByClassName(document,'box-box','div')[0].style.background='yellow';
//第三種:選擇document下的所有class為box-box元素
getElementsByClassName(document,'box-box')[0].style.background='yellow';
oEle、sClass是必填的,sEle是選填的。
sClass中又中橫線或下劃線親測木有問題,比如說:box-box box_box;但是如果是其他特殊字符就很有可能有問題了,如:box$box… 當(dāng)然可以自己加轉(zhuǎn)義搞定特殊字符,如:box\\$box…
兼容性:親測ie6+
小伙伴們自己使用一下就知道了,超級好用,擴(kuò)散下給其他小伙伴吧。
- javascript getElementsByClassName 和js取地址欄參數(shù)
- javascript getElementsByClassName函數(shù)
- javascript getElementsByClassName實(shí)現(xiàn)代碼
- IE不支持getElementsByClassName最終完美解決方案
- js 獲取class的元素的方法 以及創(chuàng)建方法getElementsByClassName
- 關(guān)于IE中g(shù)etElementsByClassName不能用的問題解決方法
- IE瀏覽器不支持getElementsByClassName的解決方法
相關(guān)文章
JavaScript實(shí)現(xiàn)無窮滾動加載數(shù)據(jù)
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)無窮滾動加載數(shù)據(jù),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05JavaScript實(shí)現(xiàn)鼠標(biāo)懸浮頁面切換效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)鼠標(biāo)懸浮頁面切換效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-03-03JavaScript事件發(fā)布/訂閱模式原理與用法分析
這篇文章主要介紹了JavaScript事件發(fā)布/訂閱模式,結(jié)合實(shí)例形式簡單分析了javascript發(fā)布/訂閱模式的概念、原理及簡單使用方法,需要的朋友可以參考下2018-08-08微信小程序?qū)崿F(xiàn)全局狀態(tài)管理的方法整理
已知微信小程序中如果要做到全局狀態(tài)共享,常用的有四種方式,分別是globalData、本地緩存、mobx-miniprogram和westore,本文將帶大家看看mobx-miniprogram是如何實(shí)現(xiàn)的小程序的全局狀態(tài)管理,需要的可以收藏一下2023-06-06如何獲取select下拉框的值(option沒有及有value屬性)
獲取select下拉框的值分為option沒有value屬性及有value屬性時(shí)的兩種情況,下面分別給出具體的實(shí)現(xiàn)代碼,需要的朋友可以參考下2013-11-11layui前端時(shí)間戳轉(zhuǎn)化實(shí)例
今天小編就為大家分享一篇layui前端時(shí)間戳轉(zhuǎn)化實(shí)例,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11