getElementsByClassName
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<ul id="ul">
<li class="red">0000000</li>
<li class="green">11111<a href="#" class="reds red ">11</a>11</li>
<li class=" red ss">2222222222</li>
<li class=" 022 sda ">3333333<b class="red">333</b>33</li>
</ul>
</body>
</html>
<script type="text/javascript">
var wzw={
//清楚字符串里面的开始和结束的空格还有合并中间的多个空格为一个空格
trim:function(str){
var reg=/\s+/g;
var a=/^\s/;
var b=/\s$/;
return str.replace(b,"").replace(a,"").replace(reg," ");
},
//获取制定的class 元素
getByClass:function (id,oClass){
var re=[];
if(document.getElementsByClassName){
re=id.getElementsByClassName(oClass);
}else{
var aChild=id.getElementsByTagName("*");
var reg=new RegExp("\\b" + oClass + "\\b");
for(var i=0;i<aChild.length;i++){
if(aChild[i].nodeType=="1"){
var aClassCllect=aChild[i].className;
//var jianhua=wzw.trim(aClassCllect);
if(reg.test(aClassCllect)){
re.push(aChild[i]);
};
}
}
}
return re;
}
}
var oUl=document.getElementById("ul");
var s=wzw.getByClass(oUl,"red");
for(var i=0;i<s.length;i++){
s[i].style.color="red";
}
</script>
getElementsByClassName的更多相关文章
- DOM getElementsByClassName IE兼容方案
平时写HTML时多用class来命名,为很少用id来命名,主要原因就是class使用起来比较灵活. 但是万恶的JS在操作DOM的时候对ie6+只提供了getElementById和getElement ...
- 深入理解javascript选择器API系列第二篇——getElementsByClassName
× 目录 [1]使用 [2]classList [3]扩展 前面的话 既然有getElementById()和getElementsByTagName()方法,为什么没有getElementsByCl ...
- getElementsByClassName简单实现
function getElementsByClassName(node, className) { var aClassReg = className.split(' ').map(function ...
- 多个table切换 getElementsByClassName
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...
- getElementById() getElementsByTagName() getElementsByClassName() querySlector() querySlectorAll()区别
1. getElementById() getElementsByTagName() javascript原生的方法,这两个不会有兼容性问题. 2. getElementsByClassName() ...
- 【JavaScript兼容】关于IE8及以下无法通过getElementsByClassName()方法获得元素的解决方法
try{ var a = document.getElementsByClassName("cla"); console.log(a); }catch(ex){ var array ...
- getElementsByClassName 兼容性
getElementsByClassName是html5 新增加的一个类名.该方法可以让我们通过class属性中的类名来访问元素.不过该方法比较新,某些DOM树还没有,因此在使用中要当心.由于只有较新 ...
- 解决getElementsByClassName的兼容性问题
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 解决ie8（及其以下）不支持getElementsByClassName的问题
这篇技术笔记与大家分享的是:解决IE8(及以下)不支持getElementsByClassName的方法.如果有说错的地方,麻烦留言告诉我,我及时更正,一来是更新一下我的认知,二来也是不要误导的他人, ...
- IE8以下不支持getElementsByClassName方法
function getElementsByClassName(classStr,tagName,element){ tagName = (tagName || '*'); element = (el ...
随机推荐
- [JAVA]在linux中设置JDK环境，ZendStudio，Eclipse
1.准备JDK安装包 下载地址: http://www.oracle.com/technetwork/java/javase/downloads/index.html 下载对应平台的tar.gz格式压 ...
- Nginx防蜘蛛爬虫处理
假定一个场景:某个网站它可能不希望被网络爬虫抓取,例如测试环境不希望被抓取,以免对用户造成误导,那么需要在该网站中申明,本站不希望被抓取.有如下方法: 方法一:修改nginx.conf,禁止网络爬虫的 ...
- 69道Java Spring 面试&笔试题
目录 Spring 概述 依赖注入 Spring beans Spring注解 Spring数据访问 Spring面向切面编程(AOP) Spring MVC Spring 概述 1. 什么是spri ...
- 【python cookbook】【字符串与文本】5.查找和替换文本
问题:对字符串中的文本做查找和替换 解决方案: 1.对于简单模式:str.replace(old, new[, max]) 2.复杂模式:使用re模块中的re.sub(匹配的模式, newstring ...
- 【python cookbook】【数据结构与算法】14.对不原生支持比较操作的对象排序
问题:想在同一个类的实例之间做排序,但是它们并不原生支持比较操作. 解决方案:使用内建的sorted()函数可接受一个用来传递可调用对象的参数key,sorted利用该可调用对象返回的待排序对象中的某 ...
- zabbix源码安装
Zabbix通过C/S模式采集数据,通过B/S模式在web端展示和配置. 被监控端:主机通过安装agent方式采集数据,网络设备通过SNMP方式采集数据 Server端:通过收集SNMP和agent发 ...
- textarea输入框限制字数（JS）
第一种: <textarea onkeyup="checkLen(this)"></textarea> <div>您还可以输入 <span ...
- JavaEE基础（十七）/集合
1.集合框架(HashSet存储字符串并遍历) A:Set集合概述及特点 通过API查看即可 B:案例演示 HashSet存储字符串并遍历 HashSet<String> hs = new ...
- Quartz2D简介及基本线条绘制
* Quartz2D简介 1.什么是Quartz2D? 他是一个二维的绘图引擎,同时支持iOS和Mac系统 2.Quartz2D能完成的工作 画基本线条,绘制文字,图片,截图,自定义UIView. 3 ...
- js认清this的第一步
学习 this 的第一步是明白 this 既不指向函数自身也不指向函数的词法作用域, 你也许被这样的解释误导过, 但其实它们都是错误的.this 实际上是在函数被调用时发生的绑定, 它指向什么完全取决 ...