1.getElementByClassName

在使用原生JavaScript时,获取类选择符时,即使用getElementByClassName,它在Firefox和IE下是不能兼容。

Firefox下是可以用它获取的到元素而IE不行,一般框架都会实现该方法,达到在IE和Firefox下兼容的问题。

function getByClassName(className){
if(document.getElementByClassName){
return document.getElementByClassName(className) //FF下因为有此方法,所以可以直接获取到;
}
var nodes=document.getElementsByTagName("*");//获取页面里所有元素,因为他会匹配全页面元素,所以性能上有缺陷,但是可以约束他的搜索范围;
var arr=[];//用来保存符合的className;
for(var i=0;i<nodes.length;i++){
if(hasClass(nodes[i],className)) arr.push(nodes[i]);
}
return arr;
}
function hasClass(node,className){
var cNames=node.className.split(/\s+/);//根据空格来分割node里的元素;
for(var i=0;i<cNames.length;i++){
if(cNames[i]==className) return true;
}
return false;
}

另从网上看到一种解决的办法:

由于IE4之后对 document.all 都有支持,所以可以简单的利用是否支持 document.all判断是否为IE。

如果不是IE,则用W3C DOM的document.getElementByTagName('*')取代all

function getElementsByClassName (className) {
var all = document.all ? document.all : document.getElementsByTagName('*');
var elements = new Array();
for (var e = 0; e < all.length; e++) {
if (all[e].className == className) {
elements[elements.length] = all[e];
break;
}
}
return elements;
}

js兼容性的更多相关文章

  1. IE 和Firefox的js兼容性总结

    IE 和Firefox的js兼容性总结 12 August 2010 11:39 Thursday by 小屋 标签: 浏览器 方法 属性 IT 写法 一.函数和方法差异 1 . getYear()方 ...

  2. webpack 之js兼容性处理

    webpack 之js兼容性处理 // 用来拼接绝对路径的方法 const {resolve} = require('path') const HtmlWebpackPlugin = require( ...

  3. js兼容性问题总结

    JS中出现的兼容性问题的总结1.关于获取行外样式 currentStyle 和 getComputedStyle 出现的兼容性问题  我们都知道js通过style不可以获取行外样式,当我们需要获取行外 ...

  4. js兼容性记录

    做BS开发就难免会用到javascript,而每个浏览器对javascript的支持有不同.这就需要我们程序员去兼容他们,不然有些浏览器就无法运行我们的代码.就会造来客户的投诉,如果让BoSS知道了, ...

  5. ff与ie 的关于js兼容性

    FF的FIREBUG,不仅能测试JS还能检查CSS错误,是一般常用的.但它主要检查FF方面的错误,对IE就无能为力了.要测试IE,就用ieTester,它可以测试IE几乎所有版本(1.0恐怕也用不到测 ...

  6. JS兼容性问题列表

    记录平时遇见的兼容性问题,有更好的解决办法希望各位提出,会随着开发遇到问题而更新,标记为黄色的为未解决和猜测答案 提出时间 问题描述 解决方案 2014/10/22 submit按钮阻止了默认事件不能 ...

  7. js兼容性大全

    js有个第二定律好的属性/选择器一定不兼容/* 获取类名通用代码*/function getClassName(){ if(document.getElementsByClassName){ doso ...

  8. js兼容性问题

    javscript 浏览器兼容性问题: scrollTop = document.documentElement.scrollTop || document.body.scrollTop; scrol ...

  9. JS兼容性问题(FF与IE)

    不同浏览器中js兼容问题大全 1.document.formName.item('itemName')问题 说明: //IE下(两种) document.formName.item("ite ...

  10. JS兼容性处理

    百度 - 终端适配API 适合服务器端使用.POST客户端传递的http头信息越多,得到的适配信息越准确.百度返回的数据为: 正确情况: { device_type :/*1:手机2:pc*/ os: ...

随机推荐

  1. 搭建公司内部的NuGet Server

    随着公司业务慢慢的拓展,项目便会越来越来多,很多项目会依赖其他项目DLL,比如一些底层的技术框架DLL引用,还有各业务系统的也有可能会有引用的可能. 项目多,交叉引用多,如果要是有一个DLL更新,那就 ...

  2. TinyMCE的使用(包括汉化及本地图片上传功能)

    TinyMCE我就不多介绍了,这是下载地址:https://www.tinymce.com/download/ 下载下来是英文版,要汉化也很简单.首先去网上随便下载个汉化包,然后把汉化包解压后的lan ...

  3. Spring下ActiveMQ实战

    MessageQueue是分布式的系统里经常要用到的组件,一般来说,当需要把消息跨网段.跨集群的分发出去,就可以用这个.一些典型的示例就是: 1.集群A中的消息需要发送给多个机器共享: 2.集群A中消 ...

  4. Spring+ibatis动态管理数据源

    Spring动态配置多数据源,即在大型应用中对数据进行切分,并且采用多个数据库实例进行管理,这样可以有效提高系统的水平伸缩性.而这样的方案就会不同于常见的单一数据实例的方案,这就要程序在运行时根据当时 ...

  5. Linux应用程序基础

    文件位置:     系统命令:/bin和sbin目录,或shell内部指令:     应用程序:/usr/bin和/usr/sbin目录.         /usr/bin:普通执行程序文件:     ...

  6. Atitit. Atiposter 发帖机 新特性 poster new feature   v7 q39

    Atitit. Atiposter 发帖机 新特性 poster new feature   v7 q39 V8   重构iocutilV4,use def iocFact...jettyUtil V ...

  7. 【Google Chrome】 Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource问题解决

    问题??打开Google Chrome浏览器报错如下: 结论  浏览器出于安全性考虑,默认对跨域访问禁止 解决方法  给浏览器添加启动参数 --allow-file-access-from-files ...

  8. js获取页面url

    设置或获取对象指定的文件名或路径. window.location.pathname例:http://localhost:8086/topic/index?topicId=361alert(windo ...

  9. Android 7.0 Nougat牛轧糖 发布啦

    Android 7.0 Nougat牛轧糖 发布啦 Android 7.0 Nougat 牛轧糖于本月发布了. 从官方blog里可以了解到这个版本的新特性. Android 7.0 从2016年8月正 ...

  10. MVC View中获取action、controller、area名称

    获取控制器名称: ViewContext.RouteData.Values["controller"].ToString(); 获取Action名称: ViewContext.Ro ...