<!doctype html>

<html>

<head>

<meta charset="utf-8">

<meta charset="utf-8">

<title>通过class获取元素</title>

<style>

#box div { width:100px; height:100px; border:1px solid red; margin:10px; }

#box .bar { background:#ccc; }

</style>

<script>

window.onload=function (){

    var oDiv=document.getElementById('box');

    var arr=getByClass(oDiv, 'bar');

    alert(arr.length);

};

function getByClass(oParent, sClassName)

{

    var res=[];

    var aTmp=oParent.getElementsByTagName('*');

    for (var i=; i<aTmp.length; i++)

    {

        if (aTmp[i].className.indexOf(sClassName) != -1)
　　　　　　

        {

            res.push(aTmp[i]);

        }

    }

    return res;

}

</script>

</head>

<body>

    <div id="box">

        <div class="bar item"></div>

        <div class="bar"></div>

        <div class="bar"></div>

        <div></div>

        <div></div>

        <p class="bar"></p>

    </div>

</body>

</html>

js通过class获取元素的更多相关文章

  1. 原生JS与JQ获取元素的区别

    刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...

  2. 原生js来写获取元素距离顶部距离，以及滚动条滚动指定距离和时间控制

    这是我在写vue项目里封装的一个公共js类 里面还有一些其他的方法,一并拿过来了 class Public { isDesktop(){ //判断是否为pc端 return (window.scree ...

  3. JS——通过标签获取元素、循环语句、数组去重

    通过标签获取元素: var aLi = document.getElementsByTagName('Li'); aLi[0].style.backgroundColor = 'gold'; 选中部分 ...

  4. js动画之获取元素属性

    首先我们要介绍一些知识 offsetWidth element.offsetWidth = width + padding + border; width 我们也知道element.style.wid ...

  5. js通过class获取元素时的兼容性解决方案

    1:::::方法代码如下:function getByClass(sClass){    var aResult=[];    var aEle=document.getElementsByTagNa ...

  6. js根据className获取元素封装

    虽然有了getElementsByClassName,但是ie低版本不支持,所以我们需要单独定义一个getByClass function getByClass(className,parent){ ...

  7. 7.关于一些dom&&获取元素

    1. 测试点击的是否是span 标签 <span onClick={this.select.bind(this)}>点击</span>   select( e ){  cons ...

  8. js兼容获取元素的样式

    js获取元素的样式的兼容性处理: function getStyle(obj,attr){ return obj.currentStyle?obj.currentStyle[attr]:getComp ...

  9. js和jquery获取当前对象的子元素

    开发中经常遇到需要获取ul下的il对象,个人总结了js和jquery的方法. HTML片断: <ul class="box"> <li>子元素1</l ...

随机推荐

  1. CDC画图

    CDC* pdc: CRect rcBounds: 1. 画直线 pdc->MoveTo(rcBounds.TopLeft());//将画笔移动到左上角这个点,使用这个点作为起点画图 pdc-& ...

  2. Python3基础 __repr__ 实例对象的名字，可以显示信息

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  3. The destination you provided is not a full refname (i.e., starting with "refs/")

    $ git push v5 v5/hotfix/5.1:hotfix/5.1-quartzerror: The destination you provided is not a full refna ...

  4. NS3 使用NS3工具PyViz

    官方文档 跑了一个样例(first.py): 由于 NetAnim 对我实在是有点不友好,在 PyViz 和 NetAnim 之间,我倾向前者.后者需要生成.xml文件,相比前者较为麻烦. 安装过程: ...

  5. js文字转移效果

    这个例子算是有点样子的. 思路: 字符串操作.左框里面先是预设的.点击按钮时截取左框中的字符串的前一个字符到右框里的字符串后面,以此循环.点击按钮时按钮变为灰色,在循环完成后恢复.计数的总数(右边)是 ...

  6. UVa 11300 分金币

    https://vjudge.net/problem/UVA-11300 题意: 圆桌上有n个人,每个人都有一定的初始金币,每个人可以给他旁边的人一些金币,最终使每个人的金币数相等.计算最少需要转手的 ...

  7. linux 系统管理的10个小技巧

    1.恢复屏幕 尝试输入:#cat /bin/cat 输入的屏幕内容非常凌乱,那么该怎么做? 输入:#reset 那么屏幕恢复正常了,比关闭再次登录好多了,特别是经过至少5台机器和SSH2才能到达 2. ...

  8. codeforces 350 div2 D Magic Powder - 2 二分

    D2. Magic Powder - 2 time limit per test 1 second memory limit per test 256 megabytes input standard ...

  9. poj 1330 Nearest Common Ancestors lca 在线rmq

    Nearest Common Ancestors Description A rooted tree is a well-known data structure in computer scienc ...

  10. django模型的继承

    很多时候,我们都不是从‘一穷二白’开始编写模型的,有时候可以从第三方库中继承,有时候可以从以前的代码中继承,甚至现写一个模型用于被其它模型继承.这样做的好处,我就不赘述了,每个学习Django的人都非 ...