<!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. 字符串分割(C++)(转载)

    转载出自:http://www.cnblogs.com/MikeZhang/archive/2012/03/24/MySplitFunCPP.html 经常碰到字符串分割的问题,这里总结下,也方便我以 ...

  2. 【angular2+typeScript+ng-zorro】Carousel 走马灯的左右方向控件实现

    ng-zorro Carousel 走马灯的左右方向控件实现 ng-zorro框架的走马灯本身还没有左右方向控件的实现,作者只是在文档中(0.6x)中曝出几个方法接口,如图: 实现: 在根compon ...

  3. 【第二十八章】 springboot + zipkin(brave定制-AsyncHttpClient)

    brave本身没有对AsyncHttpClient提供类似于brave-okhttp的ClientRequestInterceptor和ClientResponseInterceptor,所以需要我们 ...

  4. Educational Codeforces Round 27 A B C

    A. Chess Tourney   Berland annual chess tournament is coming! Organizers have gathered 2·n chess pla ...

  5. React Native基础概念和基础认识

    学习地址:https://github.com/vczero/react-native-lesson 当我们初始化一个RN项目的时候主要的是index.ios.js文件和index.android.j ...

  6. Cocos2d-x学习笔记(十一)动作

    动作类Action是一切动作的祖先类.它有三个直接继承子类: FiniteTimeAction受时间限制的动作: Follow精灵跟随精灵的动作: Speed运动速度控制: 而FiniteTimeAc ...

  7. mybatis generator插件系列--lombok插件 (减少百分之九十bean代码)

    经常使用mybatis generator生成代码的你 有没有因为生成的getter/setter而烦恼呢? 有没有生成后又手动加toString/hashCode/Equals方法呢? 有没有改一个 ...

  8. mysql 开启远程访问

    # vi /etc/mysql/my.cnf修改 bind-address = 127.0.0.1  为  bind-address = 0.0.0.0 修改完成后重启mysql服务 # sudo / ...

  9. 算法笔记--lca倍增算法

    算法笔记 模板: vector<int>g[N]; vector<int>edge[N]; ][N]; int deep[N]; int h[N]; void dfs(int ...

  10. typescripts学习

    可选与默认参数 可选参数:在参数名后面,冒号前面添加一个问号,则表明该参数是可选的.如下代码: function buildName(firstName: string, lastName?: str ...