<!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. intent bundle的使用

    1.什么是bundle Bundle主要用于传递数据:它保存的数据,是以key-value(键值对)的形式存在的.我们经常使用Bundle在Activity之间传递数据,传递的数据可以是boolean ...

  2. Leading and Trailing（数论/n^k的前三位）题解

    Leading and Trailing You are given two integers: n and k, your task is to find the most significant ...

  3. 【第三章】 springboot + jedisCluster

    如果使用的是redis2.x,在项目中使用客户端分片(Shard)机制.(具体使用方式:第九章 企业项目开发--分布式缓存Redis(1)  第十章 企业项目开发--分布式缓存Redis(2)) 如果 ...

  4. 51nod 1021 石子归并

    区间dp 递推比递归的常数要小  所以还是尽量学会递推吧 看题解  各种恶心啊  有木有 还是视频讲的直接呃   不过就是讲的有点儿慢 链接:https://www.bilibili.com/vide ...

  5. 读jQuery源码有感

    读之前的预备工作: 1.基础的js知识,以及html和css知识,和正则表达式知识.可以参考妙味课堂的基础js,html和css大纲. 2.JavaScript核心指南的知识http://www.cn ...

  6. python 集合删除元素

    #Create a new set num_set = , , , , , ]) #Discard number num_set.discard() print(num_set)

  7. golang基础类型

    1.变量 Go使用关键字var定义变量,类型信息放在变量名后面,初始化为零,如下: 在函数内部还有一种更简洁的:=定义方式 变量赋值,两个变量可直接交换 注意:函数内部定义的变量没使用的话编译器会报错 ...

  8. iconfont使用方法

    最近才发现一种新的iconfont的使用方法 http://www.iconfont.cn/ 经常使用的图标放在一个项目里 需要关注的几点: 使用方法有三种方式unicode  , font clas ...

  9. threejs和3d各种效果的学习

    写给即将开始threejs学习的自己,各种尝试,各种记忆.不要怕,灰色的年华终会过去. 一个技术学习的快慢,以及你的深刻程度,还有你的以后遇到这个东西的时候的反应速度,很大程度上,取决于你的博客的深刻 ...

  10. Android Toast.makeText用法

    Toast是Android中用来显示显示信息的一种机制,和Dialog不一样的是,Toast是没有焦点的,而且Toast显示的时间有限,过一定的时间就会自动消失.下面用一个实例来看看如何使用Toast ...