js獲取class的所有元素
<html>
<head>
<script type="text/javascript">
window.onload = function()
{ var topMenus = getClass('li','topMenu');
for(var i=0;i < topMenus.length; i++)
{
alert(topMenus[i].innerHTML);
}
}
function getClass(tagName,className) //獲得標(biāo)簽名為tagName,類名className的元素
{
if(document.getElementsByClassName) //支持這個(gè)函數(shù)
{ return document.getElementsByClassName(className);
}
else
{ var tags=document.getElementsByTagName(tagName);//獲取標(biāo)簽
var tagArr=[];//用于返回類名為className的元素
for(var i=0;i < tags.length; i++)
{
if(tags[i].class == className)
{
tagArr[tagArr.length] = tags[i];//保存滿足條件的元素
}
}
return tagArr;
}
}
</script>
</head>
<body>
<ul id="nav">
<li class="topMenu"><a href="#">產(chǎn)品介紹</a>
<ul class="subMenu">
<li><a href="#">產(chǎn)品1</a></li>
<li><a href="#">產(chǎn)品2</a></li>
<li><a href="#">產(chǎn)品3</a></li>
<li><a href="#">產(chǎn)品4</a></li>
<li><a href="#">產(chǎn)品5</a></li>
<li><a href="#">產(chǎn)品6</a></li>
</ul>
</li>
<li class="topMenu"><a href="#">服務(wù)介紹</a>
<ul class="subMenu">
<li><a href="#">服務(wù)1</a></li>
<li><a href="#">服務(wù)2</a></li>
<li><a href="#">服務(wù)3</a></li>
<li><a href="#">服務(wù)4</a></li>
</ul>
</li>
<li class="topMenu"><a href="#">成功案例</a>
<ul class="subMenu">
<li><a href="#">案例1</a></li>
<li><a href="#">案例2</a></li>
<li><a href="#">案例3</a></li>
<li><a href="#">案例4</a></li>
</ul>
</li>
<li class="topMenu"><a href="#">關(guān)于我們</a>
<ul class="subMenu">
<li><a href="#">我們1</a></li>
<li><a href="#">我們2</a></li>
<li><a href="#">我們3</a></li>
<li><a href="#">我們4</a></li>
</ul>
</li>
<li class="topMenu"><a href="#">聯(lián)系我們</a>
<ul class="subMenu">
<li><a href="#">聯(lián)系1</a></li>
<li><a href="#">聯(lián)系2</a></li>
<li><a href="#">聯(lián)系3</a></li>
<li><a href="#">聯(lián)系4</a></li>
<li><a href="#">聯(lián)系5</a></li>
<li><a href="#">聯(lián)系6</a></li>
<li><a href="#">聯(lián)系7</a></li>
</ul>
</li>
</ul>
</body>
</html>
注意getElementsByClassName和getElementsByTagName都有s；
js中不能用int a=1;要用var a=1;
- js中設(shè)置元素class的三種方法小結(jié)
- js獲取某元素的class里面的css屬性值代碼
- javaScript給元素添加多個(gè)class的簡單實(shí)現(xiàn)
- js通過元素class名字獲取元素集合的具體實(shí)現(xiàn)
- js選取多個(gè)或單個(gè)元素的實(shí)現(xiàn)代碼（用class）
- 基于原生js實(shí)現(xiàn)判斷元素是否有指定class名
- js 獲取class的元素的方法 以及創(chuàng)建方法getElementsByClassName
- javascript通過class來獲取元素實(shí)現(xiàn)代碼
- js如何根據(jù)class獲取元素并且點(diǎn)擊元素詳解
相關(guān)文章
本文為大家詳細(xì)介紹下JS去前后空格及所有空格，代碼在IE9環(huán)境下測(cè)試，感興趣的朋友可以參考下哈，希望對(duì)大家有所幫助2013-07-07
JS格式化字符串的兩種方法(反引號(hào)與String.prototype)
本文一共介紹了兩種實(shí)現(xiàn)方式,使用反引號(hào)或自定義方法實(shí)現(xiàn),需要的朋友可以參考下2023-06-06
這篇文章主要介紹了微信小程序引入VANT組件的方法步驟，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
本文主要分享了javascript中遞歸的兩種寫法，具有一定的參考價(jià)值，下面跟著小編一起來看下吧2017-01-01
用ASP將SQL搜索出來的內(nèi)容導(dǎo)出為TXT的代碼
用ASP將SQL搜索出來的內(nèi)容導(dǎo)出為TXT的代碼...2007-07-07
本文主要介紹了js判斷是否是手機(jī)頁面的方法。具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-03-03
這篇文章主要介紹了JS計(jì)算輸出100元錢買100只雞問題的解決方法,簡單描述了100元錢買100只雞問題并結(jié)合實(shí)例形式分析了問題解決的思路與具體實(shí)現(xiàn)方法,需要的朋友可以參考下2018-01-01
這篇文章主要介紹了深入淺出es6模板字符串,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08
javascript實(shí)現(xiàn)拖動(dòng)層效果代碼(符合標(biāo)準(zhǔn)且兼容IE,chrome,firefox)
javascript實(shí)現(xiàn)拖動(dòng)層，原理很簡單，就是根據(jù)鼠標(biāo)的位置實(shí)時(shí)設(shè)置層的left和top2013-06-06
這篇文章主要介紹了如何使用pdf.js展示pdf文件(親測(cè)可用),如果只是電腦端,可通過 iframe 標(biāo)簽嵌套預(yù)覽,文中介紹了安裝電腦ios的通用方法,感興趣的朋友跟隨小編一起看看吧2023-10-10