<!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. redis持久化RDB和AOF-转载

    Redis 持久化: 提供了多种不同级别的持久化方式:一种是RDB,另一种是AOF. RDB 持久化可以在指定的时间间隔内生成数据集的时间点快照(point-in-time snapshot). AO ...

  2. HDU 6162 Ch's gift（树链剖分+线段树）

    题意: 已知树上的每个节点的值和节点之间的关系建成了一棵树,现在查询节点u到节点v的最短路径上的节点值在l到r之间的节点值的和. 思路: 用树链剖分将树映射到线段树上,线段树上维护3个值,max,mi ...

  3. HDU 6127 Hard challenge（扫描线）

    http://acm.hdu.edu.cn/showproblem.php?pid=6127 题意: 有n个点,每个点有一个$(x,y)$坐标和一个权值,任意两点之间都有连线,并且连线的权值为两个顶点 ...

  4. LA 3135 阿格斯（优先队列）

    https://vjudge.net/problem/UVALive-3135 题意: 你的任务是编写一个称为Argus的系统.该系统支持一个Register的命令 Register Q_num Pe ...

  5. Cocos2d-x学习笔记（十）CC_CALLBACK回调函数相关宏

    这里加入一个插曲,是关于Cocos2d-x回调函数的.首先,让我们Cocos支持的回调函数宏有哪些,以及其原型: // new callbacks based on C++11 #define CC_ ...

  6. go 内建变量类型

    bool,string (u)int,(u)int8,(u)int16,(u)int32,(u)int64,uintptr(指针) byte,rune(字符) float32,float64,comp ...

  7. awk 提取数字

    echo b1c2d3d1e8f9 | awk ' { string=$0 len=length(string) for(i=0; i<=len; i++) { tmp=substr(strin ...

  8. VS2013_CodeLens

    CodeLens 只有VS2013 旗舰版 (update 2及以上) 才可以用,高级版 专业版都没有. 如何打开CodeLens呢?在VS菜单栏 >> 工具 >> 选项 &g ...

  9. Qt与FFmpeg联合开发指南（一）——解码（1）：功能实现

    前言:对于从未接触过音视频编解码的同学来说,使用FFmpeg的学习曲线恐怕略显陡峭.本人由于工作需要,正好需要在项目中使用.因此特地将开发过程总结下来.只当提供给有兴趣的同学参考和学习. 由于FFmp ...

  10. 554C - Kyoya and Colored Balls

    554C - Kyoya and Colored Balls 思路:组合数,用乘法逆元求. 代码: #include<bits/stdc++.h> using namespace std; ...