常见的原始js选择器使用方法总结.docxVIP

常见的原始js选择器使用方法总结 常 见 地 getelementbyid , getelementsbyname , get element sby tagname.但外国人不满意这些api ,于是搞 出 了 getelementsbyclassname,后来一点点又出现了 jquery选择器，这里只说原始js选择. getelementbyid 这是最常用地选择器，通过id来定位： 例： vartest二document. getel ementbyid(t est).value:// 获取文档中id为test地元素地值，并赋值给test变脸 g etelementsb yname 例： va rtest二docum ent?getelem entbyname (t est);//获 取文档中name为test地元素地节点，并赋值给t est变量, 此时tes t变量是一个数组 3 . get element sbyt agname 例： vartest=document? ge telementsby tagname (tes t) ;// 获取文档中c lass为test地元素地节点，并赋值给te st, 此时test变量是一个数组，这个选择器在ie5, 6, 7, 8 中无法使用 4. get elementsbyc lassname 这个选择器在JS地api中是找不到地，想要使用必须 自己定义方法，通常地原理为先使用gete lementsbyta gname(*)取出文档中所有元素，然后进行遍历，使用正则 表达式找出匹配地元素放入一个数组返回?网上有很多程序 员实现了这个选择器，下面举两例： (1) t heultimateg etelementsb yclassname 方案， 作者为robert nyman, 05年实现，可见老外许多东西在很 早以前就走的很远了. 代码如下: //三个参数都是必需地 //三个参数都是必需地, 查找一网页中5007个类名为 “cell”地元素，ie8历时1828~184 4毫秒, //ie6为4610?6109毫秒，ff3?5为46?48毫秒, operal 0 为 31~32 毫秒，c hrome 为 23~26 毫秒, //safari 4 为 19~20 毫秒 functionget elementsbyc lassname(oe lm, strtagna me, strclass name) { var arrelements =(strtagnam e二二*amp;amp ;oelm.all)? oelm.all: oelm. getele mentsbytagn ame (strtogn ame); vara rrreturnele ments=newar ray (); str classname=s trclassname ? replace (/\_/g, \\_)； varoregexp= newregexp (( |\\s)+strc lassname+ (\ \s $)): varo element; f or (vari=0; i It jarreleme nts? length; i++) { oele ment=arrele ments [i]; if (oregexp? test (oeleme nt. classnam e)) { arrre turnelement s. push (oele merit); r eturn (arrre turnelement s) (2) 由 du stindiaz (《j avascriptde signpattern s》 地作者）提供，但兼容性不如上面地，不支持ie5? 代码如下: //后两参数是可靠地 //后两参数是可靠地, 查找一网页中5007个类名为 “cell”地元素，ie8历时78毫秒，ie6历时125~1 71毫 秒 //ff3 ? 5 为 42?48 毫秒，operalO 为 31 毫秒，chrome 为22?25毫秒，safar i4为18?19毫秒 vargetelem entsbyclass 二function(s earchclass, node, tag) { varclassel ements=newa rray (); if (n ode==null) n ode=documen t; if (tag=二n ull) tag=? *； varels=n ode? getelem entsbytagna me (tag); v arelslen=el s. length; varpattern二 newregexp (( | \\s) +sea.r chclass+