推薦一個(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+
小伙伴們自己使用一下就知道了，超級(jí)好用，擴(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)文章
這篇文章主要為大家詳細(xì)介紹了一個(gè)值得分享的bootstrap table實(shí)例,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-09-09
Iview DatePicker 限制選擇當(dāng)前月份及以后的月份
文章介紹了如何使用iviewDatePicker組件限制用戶只能選擇當(dāng)前月份及以后的月份,并提供了相關(guān)的html代碼和js代碼示例,感興趣的朋友跟隨小編一起看看吧2024-11-11
JavaScript代表客戶端，而Session代表的是服務(wù)器（不知道這樣說大家是否能夠理解）接下來介紹JavaScript如何控制Session，感興趣的朋友可以了解下啊2013-01-01
JavaScript中使用Substring刪除字符串最后一個(gè)字符
刪除字符串最后一個(gè)字符的方法有很多，在本文將為大家介紹下js中的substring是如何做到的，需要的朋友可以參考下2013-11-11
本文將結(jié)合實(shí)例代碼，介紹Bootstrap5的斷點(diǎn)與容器的具體使用，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-07-07
本文將介紹js彈出的對(duì)話窗口永遠(yuǎn)保持居中顯示實(shí)現(xiàn)方法，需要了解的朋友可以參考下2012-12-12
本篇文章小編為大家介紹，關(guān)于ExtJS4.1 快捷鍵支持的問題。需要的朋友參考下2013-04-04
絕對(duì)經(jīng)典的滑輪新聞顯示(javascript+css)實(shí)現(xiàn)
這篇文章主要介紹了絕對(duì)經(jīng)典的滑輪新聞顯示(javascript+css)實(shí)現(xiàn),需要的朋友可以參考下2007-03-03
BootStrap智能表單實(shí)戰(zhàn)系列(九)表單圖片上傳的支持
這篇文章主要介紹了BootStrap智能表單實(shí)戰(zhàn)系列(九)表單圖片上傳的支持,介紹如何在生成表單后，可以支持上傳圖片后可以及時(shí)預(yù)覽圖片的功能，需要的朋友可以參考下2016-06-06
大家都喜歡用innerHTML添加內(nèi)容，但是innerHTML這東西在兩大陣營中有許多不同。2010-02-02