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) //獲得標簽名為tagName,類名className的元素
{
if(document.getElementsByClassName) //支持這個函數(shù)
{ return document.getElementsByClassName(className);
}
else
{ var tags=document.getElementsByTagName(tagName);//獲取標簽
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="#">服務介紹</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="#">成功案例</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;
相關(guān)文章
next.js?getServerSideProps源碼解析
這篇文章主要為大家介紹了next.js?getServerSideProps源碼解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-10-10深入理解requireJS-實現(xiàn)一個簡單的模塊加載器
本篇文章主要介紹了深入理解requireJS-實現(xiàn)一個簡單的模塊加載器,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-01-01JavaScript canvas實現(xiàn)鏡像圖片效果
這篇文章主要為大家詳細介紹了JavaScript canvas實現(xiàn)鏡像圖片效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-08-08JavaScript 對象深入學習總結(jié)(經(jīng)典)
JavaScript中,除了五種原始類型(即數(shù)字,字符串,布爾值,null,undefined)之外的都是對象了,所以,不把對象學明白怎么繼續(xù)往下學習呢?本篇文章給大家分享javascript對象深入學習總結(jié),小伙伴們跟著小編一起深入學習吧2015-09-09