Question

在我正在处理的应用程序中，我使用prototype的$$函数来获取页面上的所有A HREF元素并通过javascript更改其链接。只要页面上有合理数量的链接，这样就可以正常工作。

在一些罕见的用例中，$$函数返回5K +命中（aweful :)）是否有任何方法可以优化其行为，或完全摆脱它以获得更高性能的东西？

编辑 - 评论中的重要细节

具体代码是：

$$('a:not([href="#"])').each(function(item){});

我正在使用prototypejs 1.7.1

Answer 1

如果你的选择器有点慢，那可能是:not()正在做的。您可以从所有<a>元素的列表开始过滤掉具有显式代码的代码：

var anchors = $$('a').reject(function(a) { return a.href === '#'; });

（我的Prototype很生锈:)这适用于使用Sizzle的任何现代图书馆。像:not这样的伪选择器运算符效率不高;当情况不涉及大规模因素时，它们可用作速记，但在像你这样的情况下不是一个好主意。查找文档中的所有<a>元素确实快，然后遍历该列表也应该非常快。

Answer 2

你可以用完全不同的方式解决这个问题。

例如，你有一张包含5000条记录的表

<table id="recordtable">
<tr>
    <td>Record 1</td>
    <td><a href="#link1">click here</a></td>
</tr>
......//snip
<tr>
    <td>Record 100</td>
    <td><a href="#link100">click here</a></td>
</tr>
.......//snip
</table>

现在让观察者在桌子上观看点击链接

$('recordtable').on('click','a:not([href="#"])',function(e){
    //FYI 'this' points to the table element
    //e is the event object passed in-------------------^^^
    //use e.findElement() to get the element that the click originated on
    var el = e.findElement();
    if(el.readAttribute('href') != "something")
    {
        window.location.href = 'some other link';
    }
    //most importantly stop the event so that the link doesn't fire
    e.stop();
});

优化$$函数（prototypejs）

2 个答案: