前面的話
既然有g(shù)etElementById()和getElementsByTagName()方法，為什么沒有g(shù)etElementsByClassName()呢？id屬性、標(biāo)簽名、class屬性并沒有什么優(yōu)劣之分啊。終于，HTML5新增了getElementsByClassName()方法，由于在CSS布局中類名的廣泛使用，該方法正好切中痛點(diǎn)，使得通過類名選取元素不再麻煩，成為最歡迎的一個(gè)方法。接下來，本文將詳細(xì)介紹該方法
使用
HTML元素的class屬性值是一個(gè)以空格隔開的列表，可以為空或包含多個(gè)標(biāo)識(shí)符。在javascript中class是保留字，所以使用className屬性來保存HTML的class屬性值
getElementsByClassName()方法接收一個(gè)參數(shù)，即一個(gè)包含一個(gè)或多個(gè)類名的字符串，返回帶有指定類的所有元素的類數(shù)組對(duì)象NodeList。傳入多個(gè)類名時(shí)，類名的先后順序不重要。與getElementsByTagName()類似，該方法既可以用于HTML文檔對(duì)象，也可以用于element元素對(duì)象
[注意]IE8-瀏覽器不支持
<ul id="list">
<li class="a ab c">1</li>
<li class="a">2</li>
<li class="ac">3</li>
<li class="a b c">4</li>
<li class="a b">5</li>
</ul>
<script>//類名中存在a成立Array.prototype.forEach.call(list.getElementsByClassName('a&
延伸閱讀
- ssh框架
2016-09-30
- 阿里移動(dòng)安全 [無線安全]玩轉(zhuǎn)無線電——不安全的藍(lán)牙鎖
2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe
2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】
2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞
2017-07-26
- 從棧不平衡問題 理解 calling convention
2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明
2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解
2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析
2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來看看(二)
2017-07-26
學(xué)習(xí)是年輕人改變自己的最好方式