<!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的更多相关文章

  1. DOM getElementsByClassName IE兼容方案

    平时写HTML时多用class来命名,为很少用id来命名,主要原因就是class使用起来比较灵活. 但是万恶的JS在操作DOM的时候对ie6+只提供了getElementById和getElement ...

  2. 深入理解javascript选择器API系列第二篇——getElementsByClassName

    × 目录 [1]使用 [2]classList [3]扩展 前面的话 既然有getElementById()和getElementsByTagName()方法,为什么没有getElementsByCl ...

  3. getElementsByClassName简单实现

    function getElementsByClassName(node, className) { var aClassReg = className.split(' ').map(function ...

  4. 多个table切换 getElementsByClassName

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...

  5. getElementById() getElementsByTagName() getElementsByClassName() querySlector() querySlectorAll()区别

    1. getElementById() getElementsByTagName()  javascript原生的方法,这两个不会有兼容性问题. 2. getElementsByClassName() ...

  6. 【JavaScript兼容】关于IE8及以下无法通过getElementsByClassName()方法获得元素的解决方法

    try{ var a = document.getElementsByClassName("cla"); console.log(a); }catch(ex){ var array ...

  7. getElementsByClassName 兼容性

    getElementsByClassName是html5 新增加的一个类名.该方法可以让我们通过class属性中的类名来访问元素.不过该方法比较新,某些DOM树还没有,因此在使用中要当心.由于只有较新 ...

  8. 解决getElementsByClassName的兼容性问题

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  9. 解决ie8(及其以下)不支持getElementsByClassName的问题

    这篇技术笔记与大家分享的是:解决IE8(及以下)不支持getElementsByClassName的方法.如果有说错的地方,麻烦留言告诉我,我及时更正,一来是更新一下我的认知,二来也是不要误导的他人, ...

  10. IE8以下不支持getElementsByClassName方法

    function getElementsByClassName(classStr,tagName,element){ tagName = (tagName || '*'); element = (el ...

随机推荐

  1. Silverlight ModelView中调用UI进程

    Silverlihgt:  Deployment.Current.Dispatcher.BeginInvoke wpf: App.Current.Dispatcher.Invoke  

  2. zw版【转发·台湾nvp系列Delphi例程】.NET调用HALCON COM控件内存释放模式

    zw版[转发·台湾nvp系列Delphi例程].NET调用HALCON COM控件内存释放模式 ------------------------------------方法一 :Imports Sys ...

  3. 160929、各数据库连接配置与maven依赖安装

    最近做的项目都是maven的,据说maven是个东西.把依赖的jar文件的事情都委托出去辣!试着用了一下哈,效果还可以! 今天做了数据库配置这一块,特意把相关的东西总结出来,以备不时之需. MySQL ...

  4. 160921、React入门教程第一课--从零开始构建项目

    工欲善其事必先利其器,现在的node环境下,有太多好用的工具能够帮助我们更好的开发和维护管理项目. 我本人不建议什么功能都自己写,我比较喜欢代码复用.只要能找到npm包来实现的功能,坚决不自己敲代码. ...

  5. 搬瓦工的ShadowSock设置方法:

  6. 在 VirtualBox 中 CentOS 网络设置

    转自:本文发表于水景一页.永久链接:<http://cnzhx.net/blog/minimal-centos-in-virtualbox/>.转载请保留此信息及相应链接. 4. 设置¶ ...

  7. svn down代码的时候提示“由于目标计算机积极拒绝,无法连接”

    如上图所示: 原因1:svn没有启动成功 原因2:防火墙没有svn的端口号3690 解决方法: 1.启动svn服务 svnserve -d -r svn路径   例如:svnserve -d -r / ...

  8. JavaEE基础(二十)/IO流

    1.IO流(IO流概述及其分类) 1.概念 IO流用来处理设备之间的数据传输 Java对数据的操作是通过流的方式 Java用于操作流的类都在IO包中 流按流向分为两种:输入流,输出流. 流按操作类型分 ...

  9. java JPEGImageEncoder;图像处理

    在Eclipse中处理图片,需要引入两个包: import com.sun.image.codec.jpeg.JPEGCodec; import com.sun.image.codec.jpeg.JP ...

  10. c语言中各个类型的sizeof长度

    #include <stdio.h> int main() {     printf("\nA Char is %lu bytes", sizeof( char )); ...