在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. Python Unofficial Windows Binary

    python一些安装包有时候在windows下无法 直接安装. 可以在一个非官方的Python Windows扩展库里面找到对应的打包好的whl,下载后直接安装. https://www.lfd.uc ...

  2. 《Java从入门到失业》第一章:计算机基础知识(一):二进制和十六进制

    0 前言 最近7年来的高强度工作和不规律的饮食作息,压得我有些喘不过气,身体也陆续报警.2018年下半年的一场病,让我意识到了这个问题的严重性,于是开始强制自己有规律饮食和作息,并辅以健身锻炼,不到2 ...

  3. gpio模拟i2c驱动

    前段时间做项目,需要gpio模拟i2c通信,最后参考了一些资料,然后编写了一个程序.现在发出来,以免以后忘记,也为一些需要的朋友提供参考.不喜勿喷哈. /* 说明:该程序是基于atmel公司的sama ...

  4. linux驱动之模块化编程小总结

    本文包含了linux驱动模块化编程的基本,包括创建多线程,延时,以及makefile 以一个实例来说明 #include<linux/init.h> #include<linux/m ...

  5. 你想了解的JDK 10版本更新都在这里

    「MoreThanJava」 宣扬的是 「学习,不止 CODE」,本系列 Java 基础教程是自己在结合各方面的知识之后,对 Java 基础的一个总回顾,旨在 「帮助新朋友快速高质量的学习」. 当然 ...

  6. Ubuntu下载连接(阿里云镜像)

    ubuntu 14.04: http://mirrors.aliyun.com/ubuntu-releases/14.04/ ubuntu 16.04: http://mirrors.aliyun.c ...

  7. cenos 7 mysql

    CentOS 7的yum源中貌似没有正常安装mysql时的mysql-sever文件,需要去官网上下载 # wget http://dev.mysql.com/get/mysql-community- ...

  8. pandas电子表格的读取(pandas中的read_excel)

    上面那篇文章中,初步介绍了一个文本文件的读取:接下来介绍另外一种常见的本地数据格式,那就是Excel电子表格,如果读者在学习或者工作中需要使用Python分析某个Excel表格数据,改如何完成第一个的 ...

  9. 怎么给Ubuntu Server安装GUI桌面

    sudo apt update sudo apt upgrade sudo add-apt-repository universe sudo add-apt-repository multiverse ...

  10. jmeter参数化之 【CSV Data Set Config/CSV数据配置文件】

    这里以登录功能为例: 1.新建.txt文件,将参数值写入到txt文件中(多个参数值如:用户名,密码 之间以逗号隔开),将文件放置在想要放置的目录下 2.添加csv数据文件设置 右键线程组->添加 ...