Question

我正在尝试选择符合特定条件的元素。现在我这样做：

$('[' + attr + '="' + name + '"]', el).filter('[type!="hidden"]').get(idx);

这很慢（在Opera中为1400ms，在Chrome中为120ms）

在此之前我曾：

$('[' + attr + '="' + name + '"][type!="hidden"]', el).get(idx);

在Opera中花了5-6秒。

（具有此代码的函数在页面中被称为250-400次）

无论如何，它仍然很慢，因为我做了很多选择，Opera的总负载仍然超过2秒，具体取决于页面内容。

你认为我可以稍微改进一下这个问题吗？

ps：“attr”具有name值（name属性），我只是将其作为变量来测试其他属性是否更快

Answer 1

如果您能够在后端修改标记本身，请为每个元素添加一个公共类。然后你可以简单地选择更快的类。

此外，如果您的页面很大，但这些输入仅在屏幕的一部分中，请使用通用父级缩小范围。 $("#parent <otherselector>")

Answer 2

尝试使用标签选择器。通过这种方式，浏览器可以将一些工作卸载到getElementsByTagName，而不是过滤所有元素。我猜测input基于type=hidden限定符。

$(el).find('input[' + attr + '="' + name + '"]').filter('[type!="hidden"]').get(idx);

//Don't actually call this too often unless the DOM is changing.  Cache it and then call the get function.
var resultSet = $(el.getElementsByTagName("input"))
    .add(el.getElementsByTagName("select"))
    .add(el.getElementsByTagName("textarea"))
    .filter(function() {
        //You may need to modify this section.  select and textarea don't have a type attribute.
        return this.getAttribute(attr) == name && this.getAttribute("type") == "hidden";
    });

//Call later
resultSet.get(idx);

选择器的性能

2 个答案: