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

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

我们在给元素设置样式的时候,可以说用的最多的就是类(class)了。遗憾的是在低版本IE浏览器(IE8及其以下版本)中,我们不能用getElementsByClassName,因为IE没有为document对象添加这个方法。

// IE8及其以下版本中 这个结果是false
console.info(‘getElementsByClassName‘ in window.document);

下面,分享一下我的getElementsByTagName的兼容写法:

    /*
    参数说明:
        obj参数:一个DOM对象,getClass函数会取得这个对象下的全部元素节点。
        sClass:一个字符串,获取元素的类(class)名。
    */
    function getClass(obj,sClass){
        // 准备一个数组 做为函数调用的结果返回
        var aResult = [];
        // 如果docuemnt对象中有getElementsByClassName这个方法 我们就用浏览器提供的        因为浏览器提供的效率更高
        if(‘getElementsByClassName‘ in document){
            aResult = obj.getElementsByClassName(sClass);
        }
        // 如果浏览器没有 那么我们自己来实现 总共4步
        else{
            //1.获取obj下所有的元素
            var aEle = obj.getElementsByTagName(‘*‘);
            //2.用for循环来检查每个子元素
            for( var i=0; i<aEle.length; i++ ){
                // 3.得到每个子元素className值 这个值是字符串
                var str = aEle[i].className;
                // 4.如果该元素的class属性有我们需要的class 那么把它放进aResult
                if(str.indexOf(sClass)!=-1){
                    aResult.push(aEle[i]);
                }
            }
        }
        return aResult;
    }
时间: 2024-12-23 00:15:33

解决ie8(及其以下)不支持getElementsByClassName的问题的相关文章

解决ie8下,不支持video、audio的问题

video.audio都是html5的属性,不支持低版本的ie8,个人在用的时候,遇到了这个问题,下面是自己的解决方案 <audio controls="controls" preload="none" src="@SiteUrls.Instance().AttachmentAudioUrl(Model)"> <embed src="@SiteUrls.Instance().AttachmentAudioUrl(Mod

解决IE8、IE9不支持发送CORS跨域请求

今天在做网站兼容性测试时遇到一个问题,jQuery的$.ajax()在 IE8 浏览器下无法发送CORS请求,但Chrome.火狐.360等浏览器都是可以的. 经查阅资料发现,原来是 IE8 默认不支持 CORS 请求,网上有提示说,需要手动开启IE8的CORS请求,代码如下: 但实际测试发现这种方式只对本地访问有效,线上访问时仍然不起作用. 最终找到两种靠谱的解决方案:1.使用XMLHttpRequest原生方式实现2.借助第三方库 jQuery-ajaxTransport-XDomainRe

关于IE8 、IE7不支持getElementsByClassName的结局方案

复制此代码到<header></header> <!--[if IE 8]> <script type="text/javascript"> if(!document.getElementsByClassName){ document.getElementsByClassName = function(className, element){ var children = (element || document).getElements

IE8浏览器是不支持getElementsByClassName

function getElementsByClassName(node, className) { if (node.getElementsByClassName) { // 使用现有方法 return node.getElementsByClassName(className); } else { // 循环遍历所有标签,返回带有相应类名的元素 var results = [], elems = node.getElementsByTagName("*"); for (var i

关于IE8及其以下的IE版本不支持getElementsByClassName

之前做一下项目的时候知道IE8以及其以下的版本不支持getElementsByClassName,于是乎自己写了一个函数重新定义getElementsByClassName,函数代码如下: function getElementsByClassName(classname){ if(document.getElementsByClassName){ return document.getElementsByClassName(classname); }else{ var aa = documen

ie不支持getElementsByClassName的解决办法

目前可以这么解决,判断浏览器支不支持这个方法,如果支持就不管:如果不支持,就在document对象里加入getElementsByClassName这个方法,按兴趣的朋友可以了解下 if (navigator.appName == 'Microsoft Internet Explorer') { document.getElementsByClassName = function() { var tTagName = "*"; if (arguments.length > 1)

让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法转

让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法 最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了bootstrap3,在chrome,firefox,safari,opera,360浏览器(极速模式).搜狗浏览器等浏览器下均没有问题,而在IE8及IE11下发现样式无法显示,然后各种百度啊,最后在 雅朋网 的一个网友帖子的帮助下解决了问题,也参考了 千寻学习网 的资料,先将解决方法总结如下: 首先需要确保你的HTML页面开始部分要有DOC

转载------让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法

本文是转载及收藏 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法 最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了bootstrap3,在chrome,firefox,safari,opera,360浏览器(极速模式).搜狗浏览器等浏览器下均没有问题,而在IE8及IE11下发现样式无法显示,然后各种百度啊,最后在 雅朋网 的一个网友帖子的帮助下解决了问题,也参考了 千寻学习网 的资料,先将解决方法总结如下: 首先需要确保你的HTML页面

完美解决IE8有两个进程的问题

完美解决IE8有两个进程的问题,照以下方法设置后就只有一个进程了,没有什么负影响哦! 方法: 1.win+R,在运行框里输入:gpedit.msc,回车进入组策略设置. 2.依次展开:计算机配置——管理模板——windows组件——Internet Explorer. 3.在Internet Explorer选项下面,找到“设置选项卡进程增长”,配置值为0. 提示:1是IE8的默认值,使用这种默认设置后会使你产生相当混乱的感觉,虽然说采用了颜色来标识页面的相关性,但至少我是很不喜欢,当上面的进程