js获取class的所有元素_javascript技巧

复制代码 代码如下:

<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) //支持这个函数
    {        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="#">产品介绍</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>
        <li><a href="#">产品5</a></li>
        <li><a href="#">产品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="#">关于我们</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>
        <li><a href="#">联系5</a></li>
        <li><a href="#">联系6</a></li>
        <li><a href="#">联系7</a></li>
    </ul>
</li>

</ul>
</body>
</html>

注意getElementsByClassName和getElementsByTagName都有s;

js中不能用int a=1;要用var a=1;

时间: 2024-09-24 03:26:48

js获取class的所有元素_javascript技巧的相关文章

js获取Get值的方法_javascript技巧

本文实例讲述了js获取Get值的方法.分享给大家供大家参考,具体如下: function getUrlParam(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象 var r = window.location.search.substr(1).match(reg); //匹配目标参数 if (r!=null) return u

js 获取经纬度的实现方法_javascript技巧

js 获取经纬度的实现方法 <!-- copyright (c) 2009 Google inc. You are free to copy and use this sample. License can be found here: http://code.google.com/apis/ajaxsearch/faq/#license --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" &quo

js获取微信版本号的方法_javascript技巧

微信现在几乎已经普遍在使用,但是微信版本一直在更新,不同的版本有不同的功能,于是了解微信的版本号很重要,以便自己及时更新体验新的功能.那么如何用js获取微信版本号呢? 一.判断微信版本号 var wechatInfo = navigator.userAgent.match(/MicroMessenger\\/([\\d\\.]+)/i) ; if( !wechatInfo ) { alert("本活动仅支持微信") ; } else if ( wechatInfo[1] < &q

js获取url传值的方法_javascript技巧

本文实例讲述了js获取url传值的方法.分享给大家供大家参考,具体如下: js获取url参数值: index.htm?参数1=数值1&参数2=数值2&参数3=数据3&参数4=数值4&...... 静态html文件js读取url参数 根据获取html的参数值控制html页面输出 一.字符串分割分析法 这里是一个获取URL带QUESTRING参数的JAVASCRIPT客户端解决方案,相当于asp的request.querystring,PHP的$_GET 函数: <Scr

js获取checkbox值的方法_javascript技巧

本文实例讲述了js获取checkbox值的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>js</title> </head> <script language="javascrip

js 获取服务器控件值的代码_javascript技巧

一.获取下拉列表选中项的值和文本(select) 代码 select.htm 示例如下: 复制代码 代码如下: <html> <head><title>获取下拉列表选中项的值和文本(select)</title></head> <body> <script> //获取下拉列表选中项的文本 function getSelectedText(name){ var obj=document.getElementById(name

JS获取鼠标选中的文字_javascript技巧

js获取鼠标选中的文字代码如下所示: <html> <head> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>js获取鼠标选中的文字</title> <SCRIPT LANGUAGE="JavaScript"> <!-- functi

js获取页面description的方法_javascript技巧

本文实例讲述了js获取页面description的方法.分享给大家供大家参考.具体实现方法如下: var meta = pt.document.getElementsByTagName('meta'); var share_desc = ''; for(i in meta){ if(typeof meta[i].name!="undefined"&&meta[i].name.toLowerCase()=="description"){ share_d

js获取滚动距离的方法_javascript技巧

本文实例讲述了js获取滚动距离的方法.分享给大家供大家参考.具体实现方法如下: /** / THIRD FUNCTION * getPageScroll() by quirksmode.com * * @return Array Return an array with x,y page scroll values. */ function ___getPageScroll() { var xScroll, yScroll; if (self.pageYOffset) { yScroll = s