兼容IE的getElementsByClassName()方法

兼容IE8及以下的getElementsByClassName()方法

 1
 2     function getElementsByClassName = function(className, tagName) {
 3         //如果浏览器支持getElementsByClassName()就直接返回
 4         if(document.getElementsByClassName){
 5             return document.getElementsByClassName(className)
 6         }
 7         //否则遍历document文档指定的标签名集合
 8         var children = document.getElementsByTagName(tagName);
 9         //此数组用于保存遍历后得到的class元素
10         var elements = new Array();
11
12         for (var i = 0; i < children.length; i++) {
13             var child = children[i];
14             var classNames = child.className.split(‘ ‘);            //分割多个class元素
15             for (var j = 0; j < classNames.length; j++) {
16                 if (classNames[j] == className) {
17                     elements.push(child);
18                     break;
19                 }
20             }
21         }
22         return elements;
23     };
时间: 2024-10-10 02:32:39

兼容IE的getElementsByClassName()方法的相关文章

兼容ie5-ie11及其他主流浏览器的js document.getElementsByClassName 方法

var getElementsByClassName = function(searchClass,node,tag) { if(document.getElementsByClassName){ return document.getElementsByClassName(searchClass) }else{ node = node || document; tag = tag || '*'; var returnElements = [] var els = (tag === "*&quo

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

try{ var a = document.getElementsByClassName("cla"); console.log(a); }catch(ex){ var array = []; for(var i = 0;i<document.body.childNodes.length;i++){ if(document.body.childNodes[i].nodeType === 1){ var name = document.body.childNodes[i].clas

JS中常遇到的浏览器兼容问题和解决方法

//以下均可console.log()实验 var winW=document.body.clientWidth||document.docuemntElement.clientWidth;//网页可见区域宽 var winH=document.body.clientHeight||document.docuemntElement.clientHeight;//网页可见区域宽 //以上为不包括边框的宽高,如果是offsetWidth或者offsetHeight的话包括边框 var winWW=d

css3 media媒体查询器用法总结 兼容ie8以下的方法

总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. http://www.360doc.com/content/14/0704/06/10734150_391862769.shtml 准备工作1:设置Meta标签 首先我们在使用Media的时候需要先设置下面这段代码,来兼容移动设备的展示效果: 这段代码的几个参数解释: width = device-width:宽度等于当前设备的宽度 initial-scale:初始的缩放比例(默认设置为1.0) minimum-scale:允许

getElementsByClassName 方法兼容性封装方法二

var getElmsByClsName = function(className, results) { results = results || []; // 判断浏览器是否支持 getElementsByClassName if(document.getElementsByClassName) { // 浏览器支持这个方法 results.push.apply( results, document.getElementsByClassName(className) ); } else {

遇到的浏览器兼容问题及应对方法

前言: 上周天的时候有个学长找我帮忙做三张页面,因为没有数据交换之类的,只是单纯的前端页面,想着好久没做东西, 看书都看烦了,所以就接了也当是练手.之前因为没有系统的看书,所以其实很多问题都考虑的不全面,属于知其然不知其所以然的状态,虽然现在也还有很多要学的东西,但是知道自己的不足总比不知道强吧?而且这也算是一种进步?总之,遇到各种问题,然后我发现问题主要分为两类,一:我自己知识点不够所以不知道怎么解决的,这种问题大多求问度娘或者问大神是可以搞定的:二:属于确实是现阶段技术存在漏洞的,不论是还没

【转】向HTML中插入视频并兼容所有浏览器的方法

原文地址:http://www.jb51.net/web/168548.html 向HTML中插入视频有两种方法,一种是古老的object标签,一种是html5中的video标签,前者兼容性相对好些,后者兼容性让人头疼 最常用的向HTML中插入视频的方法有两种,一种是古老的<object></object>标签,一种是html5中的<video></video>标签. 前者的兼容性没得说,但是使用起来不太方便,后者使用起来很方便,但是兼容性让人头疼. 虽然后

避开ie6使用float后再使用margin兼容的2种方法

在网页设计中,我们有时会不经意的给自己制造出浏览器的兼容问题.造成每一款浏览器的内容排布错乱或者说并不是我们想要的结果.当然其中问题最多的还是IE6. 方法一: 使用一个空白DIV来充当目标div之间的margin值,margin的确给我们带来了很多方便,但是随之也有许多问题,不仅有IE6的双倍margin兼容问题,还有其他都有的子元素绑架父元素问题.这时,我们可以采用新建一个内容为空格符 的div,来达到margin的效果.只需要设置这个div的宽度或高度即可.float-left的时候.将新

HTML5 Shiv--解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局.大多数浏览器基本兼容html5,但目前来说ie6/ie7/ie8还不兼容html5标签,所以需要javascript处理,让其进行兼容 方法一:javascript code <!--[if lt IE9]> <script> (function() { if (!/*@[email protected]*/0) return; var e = "abbr, article, aside, a