在新手使用原生JavaScript时，常常会用到document.getElementById、document.getElementsByClassName以及document.getElementsByTagName等方式来获取到元素，进而对其进行操作。但IE9以下的版本却不支持document.getElementsByClassName方法，所以很多刚开始接触js的同学往往会很困惑这个问题。这里封装了一下三种方法的的函数，使其都能完美使用三种方法，希望能对大家有所帮助。
这里使用的$符号作为函数名。同时在传递参数时，第二个参数可以不写。
[javascript] view plain copy // 可以根据 id、class、element 查找元素 // param (字符串) : #id .class tag // obj : 父元素 [javascript] view plain copy //首先判断通过哪种方式获取元素 function $(param, obj) { // #box obj = obj || document; // 没有传递 obj 参数，则默认使用 document if (param.charAt(0) === "#") // 通过id名获取元素 return document.getElementById(param.slice(1));//这里的slice是字符串的一个函数，用于获取第2个元素及之后的字符串 if (param.indexOf(".") === 0) //<span style="font-family: Arial, Helvetica, sans-serif;">通过class名获取元素</span> return getByClass(param.slice(1), obj);//调用下面的getClass函数 return obj.getElementsByTagName(param); // tag } // 如何解决 getElementsByClassName 兼容问题 function getByClass(className, obj) { obj = obj || document; [javascript] view plain copy <span style="white-space:pre"> </span>//如果浏览器支持此方法就直接调用 if (obj.getElementsByClassName) // 支持 getElementsByClassName 方法的使用 return obj.getElementsByClassName(className); /* 不支持 getElementsByClassName 方法的使用 */ // 保存所有查找到的元素的数组结构 var result = []; // 查找出 obj 对象后代所有元素 var tags = obj.getElementsByTagName("*"); // 遍历每个元素 for (var i = 0, len = tags.length; i < len; i++) { // 获取到当前遍历元素所使用的所有类名 var classNames = tags[i].className.split(" "); // 遍历当前元素的每个类名 for (var j = 0, l = classNames.length; j < l; j++) { if ( classNames[j] === className ) { // 说明当前遍历到的元素使用过要查找的类名 result.push(tags[i]); break; } } } // 返回结果集 return result; } 下面的函数在确定浏览器不支持document.getElementsByClassName方法后，将传进来的父元素的子元素添加到一个数组中，之后对其进行遍历，将其元素的类名通过空格拆分（即split方法），最后对类名进行判断，将包含所需类名的元素名通过push（）保存到数组result中，最后返回result。