<!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. IMAP协议命令(详细)

    参照:http://www.cnblogs.com/qiubole/archive/2007/11/23/970180.html 转载:http://blog.sina.com.cn/s/blog_5 ...

  2. IntelliJ IDEA 设置代码提示或自动补全的快捷键（Alt+/）

    点击 文件菜单(File) –> 点击 设置(Settings… Ctrl+Alt+S), –> 打开设置对话框.在左侧的导航框中点击 KeyMap. 接着在右边的树型框中选择 Main ...

  3. 51nod 1106 质数检测

    #include <bits/stdc++.h> using namespace std; int n; ; bool s[maxn]; void is_prime() { memset( ...

  4. [BZOJ1196][HNOI2006]公路修建问题 二分答案+最小生成树

    Description OI island是一个非常漂亮的岛屿,自开发以来,到这儿来旅游的人很多.然而,由于该岛屿刚刚开发不久,所以那 里的交通情况还是很糟糕.所以,OIER Association组 ...

  5. P4-Related Tools Installation

    P4-Related Tools Installation 安装P4相关工具的步骤和说明. 本说明只适用于 Ubuntu 14.04 系统. 推荐安装的其他工具 mininet:SDN网络仿真工具 v ...

  6. Java String 中的一些函数与正则的结合使用

    首先正则表达式在处理字符串问题时,真的非常强大. 正则可以帮助我们处理字符串的: 匹配, 选择, 编辑, 验证等问题. 正则中"\\"表示插入一个"\" 这里仅 ...

  7. hdu 6020 MG loves apple 恶心模拟

    题目链接:点击传送 MG loves apple Time Limit: 3000/1500 MS (Java/Others)    Memory Limit: 262144/262144 K (Ja ...

  8. Linux基础※※※※连接XShell到Ubuntu 14.04 LTS

    参考链接: 博客链接1:http://blog.csdn.net/lichangzai/article/details/39379153 百度百科:http://baike.baidu.com/lin ...

  9. testNG 学习笔记 Day 3 常用的断言

    TestNG中最常用的一个断言类是Assert.java,里面有多个静态方法,这个类我们习惯叫硬断言.对应的还有一个软断言的类,叫SoftAssert.java,这个类是需要创建实例对象,才能调用相关 ...

  10. Selenium UI自动化测试 Selenium Automatic Testing

    https://www.cnblogs.com/sunada2005/archive/2013/12/22/3486314.html UI Automatic Testing 1. 什么样的项目适合自 ...