跳转到主内容
新派编程网 - 新潮编程理念,全新技术课堂!

javascript getElementsByClassName函数_javascript技巧

今天在网上看到的一个根据ClassName获取Elements的脚本,在此记录一下,以便日后使用。

使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Andr​​oid友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Andr​​oid应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更下载复制代码代码如下:var getElementsByClassName = function(searchClass, node, tag) {if (document.getElementsByClassName) {return document.getElementsByClassName(searchClass)} else {node = node || document;tag = tag || "*";var classes = searchClass.split(" "),elements = (tag === "*" && node.all) ? node.all : node.getElementsByTagName(tag),patterns = [],returnElements = [],current,match;var i = classes.length;while (--i >= 0) {patterns.push(new RegExp("(^|\s)" + classes[i] + "(\s|$)"));}var j = elements.length;while (--j >= 0) {current = elements[j];match = false;for (var k = 0, kl = patterns.length; k match = patterns[k].test(current.className);if (!match) break;}if (match) returnElements.push(current);}return returnElements;}}下面是网上其它的一些相关介绍,大家可以一起参考下。

DOM中的getElementsByClassName解释如下:DOM API 中提供3种方法取元素(getElementById,getElementsByName,getElementsByTagName),经常编写CSS的人自然就会产生疑问,有没有根据样式类名取元素的方法,可惜,DOM1/2 里面都没有这样的方法,prototype 很早就扩展过DOM的方法,添加了 getElementsByClassName,从方法名上看,似乎非常正统,与前面3种方法名称也像,分析其代码,却发现还是通过 getElementsByTagName 来实现。这个方法称不上优雅,因为需要遍历所有的元素,探测元素是否包含目标样式类名,返回符合条件的元素数组。google了一下,却没有找到更优雅高效的替代方法。

复制代码代码如下:function getElementsByClassName(className, parentElement){var elems = ($(parentElement)||document.body).getElementsByTagName("*");var result=[];for (i=0; j=elems[i]; i++){if ((" "+j.className+" ").indexOf(" "+className+" ")!=-1){result.push(j);}}return result;}既然有getElementsByClassName,一样可以有 getElementsByAttribute(如:getElementsByValue、getElementsByStyle、getElementsByType)复制代码代码如下:document.getElementsByClassName = function(className,oBox) {//适用于获取某个HTML区块内部含有某一特定className的所有HTML元素this.d= oBox || document;var children = this.d.getElementsByTagName('*') || document.all;var elements = new Array();for (var ii = 0; ii var child = children[ii];var classNames = child.className.split(' ');for (var j = 0; j if (classNames[j] == className) {elements.push(child);break;}}}return elements;}document.getElementsByType = function(sTypeValue,oBox) {//适用于获取某个HTML区块内部同属于某一特定type的所有HTML元素,如:input,script,link等等this.d= oBox || document;var children = this.d.getElementsByTagName('*') || document.all;var elements = new Array();for (var ii = 0; ii if (children[ii].type == sTypeValue) {elements.push(children[ii]);}}return elements;}function $() {var elements = new Array();for (var ii = 0; ii var element = arguments[ii];if (typeof element == 'string') element = document.getElementById(element);if (arguments.length == 1) return element;elements.push(element);}return elements;}$Cls = function (s,o){return document.getElementsByClassName(s,o);};$Type = function (s,o){return document.getElementsByType(s,o);};$Tag = function (s,o){this.d=o || document;return this.d.getElementsByTagName(s);};$Name = function (s){ //通过name的方式只能针对整个document而言,不能为其限定范围return document.getElementsByName(s);};

相关文章