<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;

js原生封装getClassName()方法-ie不支持getElementsByClassName,所以要自己实现获取类名为className的所有元素的更多相关文章

  1. 基于js原生封装的点击显示完整文字

    基于js原生封装的点击显示完整文字 (function(window) { var inner = ''; var showCont_s = function(ele) { this.init.app ...

  2. Node.js原生及Express方法实现注册登录原理

    由于本文只是实现其原理,所以没有使用数据库,只是在js里面模拟数据库,当然是种中还是需要用数据库的. 1.node.js原生方法 ①html页面,非常简单,没有一丝美化~我们叫它user.html & ...

  3. JS原生Date类型方法的一些冷知识

    ps:由于Date()是js原生函数,不同浏览器的解析器对其实现方式并不同,所以返回值也会有所区别.本文测试未特别申明浏览器的情况下,均是指win7 x64+chrome 44.0.2403.155 ...

  4. js jq封装ajax方法

    json文本格式 { "userInfo":[ {name:"admin",password:"123"}, {name:"adm ...

  5. js原生封装自定义滚动条

    /* * @Author: dothin前端 * @Date: 2015-11-21 00:12:15 * @Last Modified by: dothin前端 * @Last Modified t ...

  6. Js原生封装选项卡组件

    class MyTab extends HTMLElement{ //创建一个类名MyTab constructor(){ //构造函数 super(); //指向父类构造函数,必须要有的 const ...

  7. js原生函数一些封装

    这是一些js原生封装的函数,主要是为了兼容IE浏览器,如下 获取css样式 function getStyle(ele, prop) { if(window.getComputedStyle) { r ...

  8. js多种去重的方法总结

    第一种是比较常规的方法 思路: 1.构建一个新的数组存放结果 2.for循环中每次从原数组中取出一个元素,用这个元素循环与结果数组对比 3.若结果数组中没有该元素,则存到结果数组中 Array.pro ...

  9. Chrome JS内存泄漏排查方法(Chrome Profiles)

     原文网址:http://blog.csdn.net/kaitiren/article/details/19974269 JS内存泄漏排查方法(Chrome Profiles)   Google Ch ...

随机推荐

  1. java.net.URLEncode编码 与 URLDecode解码问题

    1.java内部加密和解密 String mytext = java.net.URLEncoder.encode("中国", "utf-8"); String ...

  2. HDU 3715 Go Deeper

    二分答案 + 2-SAT判断 #include<cstdio> #include<cstring> #include<cmath> #include<vect ...

  3. Python3基础 list(enumerate()) 将一个列表的每一个元素转换成 带索引值的元组

    镇场诗: 诚听如来语,顿舍世间名与利.愿做地藏徒,广演是经阎浮提. 愿尽吾所学,成就一良心博客.愿诸后来人,重现智慧清净体.-------------------------------------- ...

  4. Ubuntu 12.04 中文输入法

    Ubuntu 12.04 中文输入法 [日期:2012-07-28] 来源:Linux社区  作者:lqhbupt [字体:大 中 小]   Ubuntu上的输入法主要有小小输入平台(支持拼音/二笔/ ...

  5. 【knockoutjs】 Computed VS Pure Computed 区别

    Pure Computed只有当有其他subscriber的时候才会有这个对象,所对应的DOM对象 不激活的时候不存在,这样可以防止内存泄露,在Component等场景下不用担心dispose的问题. ...

  6. MFC中的NMHDR结构体和NMUPDOWN结构体

    建立spin控件,创建UDN_DELTAPOS一个消息函数后: void CSpinDlg::OnDeltaposSpin1(NMHDR* pNMHDR, LRESULT* pResult) { NM ...

  7. svn代码管理的使用工作流程

    1. 新建代码库repository. 2. checkout 到workspace. 3. checkin 回 repository. 4. release 一个版本出来(相当于拉出一个branch ...

  8. centos lvm常用命令

    # vgs -a  VG     #PV #LV #SN Attr   VSize  VFree  cinder   1   0   0 wz--n- 30.39g 30.39g  os       ...

  9. Codeforces#371 Div2

    这是一场非常需要总结的比赛,交了3题,最后终测的时候3题全部没过,一下掉到了绿名,2333 Problem A 题意:给定区间[l1,r1],[l2,r2],然后给定一个整数k,求区间当中相交的元素, ...

  10. 【supervisord】部署单进程服务的利器

    最近听了一场分享,里边同事介绍了一些python开发环境常用到的几种工具,其中之一就supervisord,分享后自己做了些功课,概括一下supervisord是一个什么东西呢 1. 它是一个独立的常 ...