转自：Garon_InE

原生js方法“document.getElementsByClassName”在ie8及其以下浏览器中不能使用，所以写了一个兼容IE的方法。

完整的页面代码如下： 
testJsGetCssClass.html

 <html>

 <head>

 <style type="text/css">

 .test_class_div {

     font-size: 14px;

     border: 1px solid #ccc;

     margin: 10px;

     padding: 5px;

     font-weight: bold;

     color: red;

 }

 </style>

 <script>

     /**

      *打印js对象详细信息

      */

     function alertObj(obj)

     {

         var description = "";

         for ( var i in obj)

         {

             var property = obj[i];

             description += i + " = " + property + "\n";

         }

         alert(description);

     }

     /**

      *通过class名和标签名获取css样式对象组

      */

     function getClassNames(classStr, tagName)

     {

         if (document.getElementsByClassName)

         {

             return document.getElementsByClassName(classStr)

         } else

         {

             //为了兼容ie8及其以下版本的方法

             var nodes = document.getElementsByTagName(tagName), ret = [];

             for (i = 0; i < nodes.length; i++)

             {

                 if (hasClass(nodes[i], classStr))

                 {

                     ret.push(nodes[i])

                 }

             }

             return ret;

         }

     }

     /**

      *判断节点class存在性

      */

     function hasClass(tagStr, classStr)

     {

         //这个正则表达式是因为class可以有多个,判断是否包含

         var arr = tagStr.className.split(/\s+/);

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

         {

             if (arr[i] == classStr)

             {

                 return true;

             }

         }

         return false;

     }

 </script>

 </head>

 <body>

     <div class="test_class_div">11111111</div>

     <div class="test_class_div">22222222</div>

     <div class="test_class_div">33333333</div>

     <script>

         //由于加载顺序,获取对象的代码应写在对象已加载之后

         var divs = getClassNames('test_class_div', 'div');

         if (null != divs)

         {

             alertObj(divs);

             //遍历对象,改其css样式

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

             {

                 divs[i].style.color = "blue";

             }

         }

     </script>

 </body>

 </html>

运行结果： 
初始字体颜色为红色，通过对象组修改后为蓝色。

firefox：

ie8:

JS兼用IE8的通过class名获取CSS对象组的更多相关文章

  1. Raphael.js image 在ie8以下的兼容性问题

    Raphael.js 在ie7,ie8浏览器内绘制图形採用的vml,在绘制image的时候会解析成 <?xml:namespace prefix = "rvml" ns = ...

  2. js兼用性

    1.document.formName.item("itemName") 问题 说明:IE下,可以使用document.formName.item("itemName&q ...

  3. JSFinder：一个在js文件中提取URL和子域名的脚本

    JSFinder介绍 JSFinder是一款用作快速在网站的js文件中提取URL,子域名的脚本工具. 支持用法 简单爬取 深度爬取 批量指定URL/指定JS 其他参数 以往我们子域名多数使用爆破或DN ...

  4. js 获取属性名称,再根据这个属性名获取值

    if (result.success) { var obj = JSON.parse(result.data); var sltObj = document.getElementById(" ...

  5. 【总结整理】js获取css的属性（内部，外部，内嵌（写在tag中））

    在JS中需要获取某个元素的宽高或者是绝对定位的位置信息,通常我们会这么写: var elemWidth = elem.style.width; console.log(elemWidth); //(空 ...

  6. js中获取css属性

    直接获取 window.onload = function() { var but = document.getElementById('button'); var div = document.ge ...

  7. JS中使用document.defaultView.getComputedStyle()、currentStyle()方法获取CSS属性值

    在对网页进行调试的过程中,经常会用到js来获取元素的CSS样式,方法有很多很多,现在仅把我经常用的方法总结如: 1. obj.style:这个方法只能JS只能获取写在html标签中的写在style属性 ...

  8. 3.jquery在js文件中获取选择器对象

    一.常用的选择器有一下几种: 1.标签选择器 2.类选择器 3.id选择器 4.并集选择器 5.层级选择器 二.如何获取选择器对象: <!DOCTYPE html> <html la ...

  9. 为什么我获取不到这个css样式？js原生获取css样式总结

    还是自己遇到的一个坑的总结吧!与其说是坑不如说自己学艺不精,让我先哭一会!! 需求 简单就是获取一个css的height (好吧 就是一个这么简单的需求) 实践 好吧 长时间的JQ 我已经对原生无能了 ...

随机推荐

  1. 树莓派使用 HLS 实现视频流直播

    说明 这次介绍一下基于上一篇文章"树莓派编译安装 FFmpeg "的应用,即 HLS 视频流直播.原理是 FFmpeg 将 USB 摄像头的原始视频流压缩为 H.264 视频流,然 ...

  2. win10 cmd 替换 powershell

    打开注册表编辑器,定位至: \HKEY_CLASSES_ROOT\Directory\Background\shell\Powershell\command cmd:  cmd.exe /s /k p ...

  3. HDU3555 区间的数里面有49的个数（数位dp）

    题目:区间的数里面有49的个数 分析: dp[pos][0]:长度为pos的数中,不包含49的,前一位不为4的有多少个:dp[pos][1]:长度为pos的数中,不包含49的,前一位为4的有多少个:d ...

  4. IP 地址子网划分

    1.1 IP地址子网划分 1)容易造成地址浪费 2)容易产生严重的广播风暴 3)会造成路由器转发压力过大 1.2     庞大的网段需要进行子网划分 1)可以有效避免地址浪费 2)有效减少广播风暴的产 ...

  5. ZPL JS 调用共享打印机

    <script type="text/javascript"> function printZpl(zpl) {var printWindow = window.ope ...

  6. git只clone仓库中指定子目录和指定文件的实现

    ## step :初始化空库 [root@vm_test backup]# mkdir devops [root@vm_test backup]# cd devops/ [root@vm_test d ...

  7. uva 133解题报告

    题目描述 为了缩短领救济品的队伍,NNGLRP决定了以下策略:每天所有来申请救济品的人会被放在一个大圆圈,面朝里面.选定一个人为编号 1 号,其他的就从那个人开始逆时针开始编号直到 N.一个官员一开始 ...

  8. linux面试题：删除一个目录下的所有文件，但保留一个指定文件

    面试题:删除一个目录下的所有文件,但保留一个指定文件 解答: 假设这个目录是/xx/,里面有file1,file2,file3..file10 十个文件 [root@oldboy xx]# touch ...

  9. 5-----Scrapy框架中Spiders用法

    Spider类定义了如何爬去某个网站,包括爬取的动作以及如何从网页内容中提取结构化的数据,总的来说spider就是定义爬取的动作以及分析某个网页 工作流程分析 1.以初始的URL初始化Request, ...

  10. shell 终端字符颜色

    终端的字符颜色是用转义序列控制的,是文本模式下的系统显示功能,和具体的语言无关,shell,python,perl等均可以调用. 转义序列是以 ESC 开头,可以用 \033 完成相同的工作(ESC ...