一个页面有分散的多个标签需要绑定同样的事件。由于不能用ID获取也不能用TagName()因为可能有的是<a>有的是input,剩下的就是用  class或者getElementsByName() 这两个来获取了。class的效率肯定慢,后者的效率如何,是按什么个顺序来查找(查找所有,然后判断name?)?

解决方案 »

  1.   

    class应该比getElementsByName()效率快
      

  2.   


    jquery应当更好一点 代码也少 呵呵
      

  3.   

    getElementsByName也好,byTagName也好,只要是获取集合,肯定需要遍历,效率当然不高
    不过对于一般网页,这种事件绑定只执行一次,执行总时间通常也只是毫秒级,比起网页里的img或者js,css等文文件下载的秒级时间来,应该完全可以承受。
      

  4.   

    jquery 只是写的代码少了,效率是一样的,如果算起jquery 库的加载,肯定还更慢
      

  5.   

    补充下:谁能解释下 浏览器执行这些 getElementById getElementsByName  getElmentsByTagName==
    这些的过程是什么,getElementById最快,快在哪,少了什么过程,反正慢的为什么慢~~~
      

  6.   

    我认为这几个函数都差不多,如果有快慢的话,是因为查找的范围不同
    getElmentsByTagName 从 HTML 的标记列表中检索,搜索范围最大
    getElementsByName 从 HTML 的 name 列表中检索,由于 name 允许重名,所以检索出的是数组
    getElementById 从 DHML 的 id 列表中检索,由于 id 必须唯一,且数量要远小于 tagName。于是速度就快些
      

  7.   

    3Q,如果有依据就更好了!   BTW 你的勋章好屌,太多了吧,鼠标放上去直接卡住了 - -!
      

  8.   

    jquery吧,选择绑定都方便。现在的网速几十k不算什么
      

  9.   

    测试结果出炉了。
    先说结论,快慢和浏览器有关,不同的浏览器实现这几个函数的机制不同,结果也不同。
    比如我的系统是XP,我用IE8,firefox11,opera11 三个浏览器测试,页面用大约 200个元素测试, 测试循环100000次的时间(毫秒)
    IE8     byname 710,bytag 710,byid 790 - 4400
    Firefox byname 48,  bytag 45, byid 24
    Opera   byname 170, bytag 170,byid 110可以看出,三种浏览器的各自的 bytag 和 byname 基本一样,其中firefox的bytag 比它的byname稍快一些(这个数据看不明显,可以将循环加大到10倍,可以看出是始终是有点差距)
    至于byid,这两种浏览器 opera 和 firefox都是显示比 bytag和byname快,这也符合我们通常的假设。
    IE就另我们大吃一惊了,他的byid居然比bytag和byname慢,而且,byid("id1"),和这个"id1"的元素位置有关,最靠前的元素,只比bytag和byname稍慢一点,最靠后的元素,居然比最靠前的元素慢5倍。下面给出测试代码<input name="myInput" type="text" size="20" id="id1" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    .................中间省略了很多元素,大家自己补上..........................
    <a href="" name="myInput" >some text </a>
    <div name="myInput">som etext </div>
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20"  /><br />
    <a href="" name="myInput" id="id2">some text </a>
        var o;
        var begin = (new Date).valueOf();
        for (var i = 0; i < 100000; i++) {
          // o = document.getElementsByName("myInput");
           // o = document.getElementsByTagName("input");
            o = document.getElementById("id1");
          //  o = document.getElementById("id2");
         }
        var end = (new Date).valueOf();
        alert(end - begin);
      

  10.   

    个人还是觉得jquery比较好用。
      

  11.   

    自己也按13楼的方法测了下
    JS原生的方法速度都很快 
    但是按jquery用class选取时 因为IE678没有getElementsByClassName方法 所以速度要慢
    总体是 如果不是特别大量的查询 基本没什么影响!