在JS中我们经常会会用到，获取一个标签的id

var aId=document.getElementById("id")

现在虽然有getElementsByClassName这个方法，但是这个方法再ie6下兼容性存在问题，所以保险起见还是封一个获取class的库

首先先看库

/**

 * Created by asus on 2016/12/4 By dirk_jian.

 */

function getByclass(oParent,sClass){

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

    var aResult=[];

    var re=new RegExp('\\b'+sClass+'\\b','i');

    for(var i=0;i<aEle.length;i++){

//            if(aEle[i].className==sClass)             //如果有多个class那就无法检测了

//            if(aEle[i].className.search(sClass)!=-1)  //!=-1证明其有sCalss，但是只是有class这几个字母就行，无法全面达到目的

        if(re.test(aEle[i].className))                //这个就是不限制范围的检测

        {

            aResult.push(aEle[i]);

        }

    }

    return aResult;

}

再看如何调用并对获取到的class的标签进行css样式的修改

 <script src="getByclass.js"></script>

    <script>

        window.onload=function(){

            oUl=document.getElementById("div1");

            var aDiv1=getByclass(oUl,'div2');

            var aDiv2=getByclass(oUl,'div3');

            for(var i=0;i<aDiv1.length;i++){

                aDiv1[i].style.border='1px solid black';

                aDiv1[i].style.width='100px';

                aDiv1[i].style.height='100px';

            }

            for(var i=0;i<aDiv2.length;i++){

                aDiv2[i].style.width='100px';

                aDiv2[i].style.height='100px';

                aDiv2[i].style.border='1px solid pink';

            }

        }

    </script>

以下为HTML

<body>

    <div id="div1">

        <div class="div2"></div>

        <div class="div3"></div>

    </div>

</body>

这样就轻松的可以获取一个标签的class了。

JS中对获取一个标签的class的方法封一个库的更多相关文章

  1. JS中如何获取<Select>中value和text的值

    原文地址:JS中如何获取<Select>中value和text的值 html代码: <select id = "city" onchange="chan ...

  2. js中页面刷新和页面跳转的方法总结

    .js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...

  3. js中的回调函数的理解和使用方法

    js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...

  4. js中页面刷新和页面跳转的方法总结 [ 转自欢醉同学 ]

    .js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...

  5. php设置cookie,在js中如何获取

    在php中设置cookie. $email="abc@163.com"; setcookie("y_email",$email,time()+3600,&quo ...

  6. 关于js中直接获取后台的值，直接弹窗获取到的值

    js里获取后台的值,以前我都是后台通过jsp中的<input>EL表达式: 后台代码把传向页面的值放入request:request.setAttribute("Success& ...

  7. js中如何获取页面的Url，域名和端口号

    有时候通过获取上个页面的Url来做一个跳转,获取域名防止非正常访问 获取上一个页面的一个URL,这个URL一般做一个页面的跳转 window.location.href <script>w ...

  8. JS中如何获取当前时间及让时间格式化

    JS中获取当前时间和JAVA里获取当前时间一样,都是直接new Date即可.不同的是,JS中用var date=new Date();JAVA中用Data data=new Date();注:JS中 ...

  9. 37-python中bs4获取的标签中如何提取子标签

    如果只是要提取一个标签 里面的属性值啥的,直接看这篇文章就可以了: 23-python用BeautifulSoup用抓取a标签内所有数据 如果是标签的嵌套,可以参考下面的思路,虽然不是很简洁,但是可以 ...

随机推荐

  1. 树上的等差数列 [树形dp]

    树上的等差数列 题目描述 给定一棵包含 \(N\) 个节点的无根树,节点编号 \(1\to N\) .其中每个节点都具有一个权值,第 \(i\) 个节点的权值是 \(A_i\) . 小 \(Hi\) ...

  2. 使用Spring Boot开发者工具进行自动重启和页面自动刷新

    简介 大家可能都听说过开发Node.js应用时可以使用多种工具对开发者提供便利,如WebPack提供了开发者服务器来支持js应用动态更替,并在保存文件时自动刷新浏览器.Spring Boot也提供了相 ...

  3. html表格、表单

    知识点一:表格 1.表格标签  table 2.表格的组成  行 tr  单元格  td 3.建立表格步骤 1.建立表格, 2.判断行数和列数 3.用行去包含单元格 4.在每个单元格中去添加内容 4. ...

  4. Linux文件权限-笔记

    文件权限共10个字符,第一个字符表示该文件是[文件夹]或[文件]——如果是字符“d"则表示该文件是文件夹:如果是字符“-”则表示是文件. 后九个字符,三个一组,共三组,分别表示[所有者权限] ...

  5. Python之运维

    这几日一直研究运维监控的事情,有次看见有一个脚本写的还不错,如今已经找不到地址了 就只能用Python代替shell了 其中原理是 监控 /proc/下的各种文件,/proc/ 顾名思义其为进程的文件 ...

  6. 安全可靠国产系统背景下的应用开发应有.NET Core的一席之地

    在中美当前背景下的安全可靠国产系统(简称安可),安可产业要实现技术自主可控,需要在四个层面逐步实现:基础硬件设施,如芯片.服务器.存储.交换机.路由器:底层软件,包括操作系统.数据库.中间件等:应用软 ...

  7. .Net MongoDB批量修改集合中子集合的字段

    环境:.Net Core 3.1 (需要导入.Net MongoDB的驱动) 模型 /// <summary> /// 收藏 /// </summary> public cla ...

  8. 从原理上理解MySQL的优化建议

    从原理上理解MySQL的优化建议 预备知识 B+树索引 mysql的默认存储引擎InnoDB使用B+树来存储数据的,所以在分析优化建议之前,了解一下B+树索引的基本原理. 上图是一个B+树索引示意图, ...

  9. Qt 让Label显示图片并把图片居中

    Qt 让Label显示图片并把图片居中   QPixmap image("./13.jpg"); QPixmap fitpixmap=image.scaled(ui->lab ...

  10. WPF Devexpress控件库中ChartControl--实现不等距x轴

    一.概要 解决问题--ChartControl不等距x轴显示 二.CS代码 用过ChartControl的开发者们应该都知道,ChartControl中设置x轴间距间隔都是固定的数值. 比如(间隔10 ...