getbyclass
其实以前我偷偷学习正则表达式的时候,写过一个getbyclass的方法,最近翻了翻到处都是错,或者好多重复的,没有用的 代码,于是显得没事我就把这个精简了一下,其实这个方法现在我觉得也是有问题的,问题在于我不知道原生的getElementsByClassName获取元素后生产的是不是数组,不管这个到不是重点,以后有时间了我在验证一下就可以了,另外我发现css是区分大小写的,看来没事看看正则还是能涨很多知识的,因为我感觉这次简化的时候收获比较大,于是我决定把这次也简化记录下来,反正记录不花钱。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>getbyclass</title>
<style>
.a{ color:green!important;}
</style>
</head>
<body>
<ul id="oUl">
<li class="A">111111111111111111111</li>
<li class="as dfd">222222222222222222222</li>
<li class="asd ad">333333333333333333333</li>
<li class="sdfsd dfd 22df">444444444444444444444</li>
<li class="jhasd gksdj">555555555555555555555</li>
<li class="asd dfgf b as era">666666666666666666666</li>
<li class="fgfa as efgf5 fghf2asdf">777777777777777777777</li>
</ul>
</body>
</html>
<script type="text/javascript">
var oUl=document.getElementById("oUl");
var aLi=document.getElementsByTagName("li");
var as=getbyclass("as",oUl);
for(var i=0;i<as.length;i++){
as[i].style.color="red";
} function getbyclass(oClass,Oparent){
var oParent=oParent||document;
if(Oparent.getElementsByClassName){
return Oparent.getElementsByClassName(oClass)
}else{
var re=[];
var reg=new RegExp("\\b"+oClass+"\\b")
var ch=oParent.getElementsByTagName("*");
for(var i=0;i<ch.length;i++){
var str=ch[i].className;
if(reg.test(str)){
re.push(ch[i]);
}
}
return re;
}
}
</script>
getbyclass的更多相关文章
- 原生js实现增加(addclass),删除(removeclass),判断是否存在(hasclass),如果存在删除,如果不存在添加(toggleclass)和获取类名(getbyclass)的方法
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 原生JavaScript实现的addclass,removeclass,hasclass,toggleclass,getbyclass
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 封装getByClass
方法一:(普通版),获取单一的class: function getByClass(oParent, sClass) { var aResult = []; var aEle = oParent.ge ...
- 正则版----getByClass函数
function getByClass(oParent,sClass){ var arr = []; var aEle = oParent.getElementsByTagName('*'); //v ...
- js中getByClass()函数
js中getByClass()函数进化史 对于js来说,我想每一个刚接触它的人都应该会抱怨:为什么没有一个通过class来获取元素的方法.尽管现在高版本的浏览器已经支持getElementsByCla ...
- js getByClass函数封装
function getByClass(oParent, sClass) { var aEle=oParent.getElementsByTagName('*'); var aResult=[]; v ...
- js 中class选择器,addClass,removeClass,hasClass,toggleClass,getByClass
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...
- 原生JS编写getByClass、addClass、removeClass、hasClass
前言: 年后换了工作,在现在的公司写交互主要使用JS原生:刚刚入门前端的时候写交互一直用的原生JS,虽然用的不怎么样.后来去之前的公司之后,leader主张把jQuery用好,JS原生自然就熟练了:一 ...
- 封装getByClass(JS获取class的方法封装为一个函数)
获取方法一(普通版) 获取单一的class: function getByClass(oParent, sClass) {//两个形参,第一个对象oParent 第二个样式名class var aEl ...
随机推荐
- 【sinatra】安装测试
$ gem install sinatra 测试: $ subl app.rb app.rb内容: require 'sinatra' get '/' do "Hello, World!&q ...
- 【crunch bang】增加壁纸图片文件
将你的壁纸图片复制到 ~/images/wallpapers/shared即可.当然你得在终端用cp命令,因为这个目录是有权限到
- (一)MapReduce篇之InputFormat,InputSplit,RecordReader(转)
平时我们写MapReduce程序的时候,在设置输入格式的时候,总会调用形如job.setInputFormatClass(KeyValueTextInputFormat.class);来保证输入文件按 ...
- innodb的锁到底占用多少内存
举个简单的例子: CREATE TABLE `sample` ( `i` ) unsigned NOT NULL auto_increment, `j` ) default NULL, PRIMARY ...
- mysql+keepalived主从切换脚本 转
Keepalived MySQL故障自动切换脚本 MySQL架构为master-slave(主从),master故障自动切换到slave上.当然也可以设置为双master,但这里有个弊端:就是当主 ...
- 【Pro ASP.NET MVC 3 Framework】.学习笔记.10.SportsStore:上传图片
1 扩展数据库 打开表定义,新增两列可空 ) 2 增强领域模型 为Products类添加如下属性 publicstring ImageMimeType { get; set; } 第一个属性不会在界面 ...
- webservice cxf error:java.lang.IllegalArgumentException: Argument(s) "type" can't be null.
客户端请求DTO和服务器端的DTO定义不一样,客户端必须定义@XmlAccessorType和@XmlType,如: @XmlAccessorType(XmlAccessType.FIELD) @Xm ...
- oracle数据库表空间文件收缩实例
Oracle数据文件收缩实例 数据文件的作用 HWM的基本概念 查看数据文件的使用情况 包括内容:数据文件大小,已经used空间,free空间,hwm信息 select /*+ ordered use ...
- Oracle触发器使用介绍
触发器,函数,包都是可以再生利用的东西,所以在创建的时候都要用到create or replace这个万能语句,接着就是主角trigger的出现了,主角出现还需要一点点波动,通常大人物都不是随随便便就 ...
- 不定参数的传递VA_LIST的用法
VA_LIST的用法:(1)首先在函数里定义一具VA_LIST型的变量,这个变量是指向参数的指针: (2)然后用VA_START宏初始化变量刚定义的VA_LIST变量,使其指向第一个可 变参数的地址: ...