在jQuery的是一个坏主意，使用[名称= X]所有选择？ [英] In jQuery is it a bad idea to use [name=X] for all selectors?

问题描述

我使用的骨干网和决定，我想的方式，被束缚和那些没有HTML元素之间进行区分。

I am using Backbone and decided that I wanted a way to differentiate between HTML elements that were bound and those that were not.

所以，我会写（在HAML）：

So I would write (in HAML):

.container
  .title(name='title')
  .separator  

正如你可以看到很明显的动态元素的标题。

As you can see it's clear that the dynamic element is title.

这样做的原因是这样我就可以乱与周围的风格，而不用担心破坏应用程序重命名类。这也意味着在模板我可以告诉动态元素，而无需奔波与骨干视图。

The reason for this was so I could mess around with the style and rename classes without worrying about breaking the app. It also means in the template I can tell what the dynamic elements are without needing to go back and forth with the Backbone View.

这意味着，我用 $（'[NAME =标题]'，this.el）引用从code这个元素。我想知道，如果这是缓慢的，如果使用的话到处出现明显的问题。我已阅读， ID 是最快的。我使用的项目列表等等 ID 是不现实的。如何类比较名称查找？

This means that I use $('[name=title]', this.el) to reference this element from code. I am wondering if this is slow and be a noticeable issue if used everywhere. I have read that id is fastest. I am using lists of items so id is unrealistic. How does class compare to name lookups?

此外，如果您有关于跟踪在HTML模板动态元素的建议，我很想听听他们。

Also, if you have suggestions about keeping track of dynamic elements in HTML templates I'd love to hear them.

FYI：

• 我有这个想法，因为我原来使用的是 Backbone.ModelBinding 插件，使用数据绑定属性动态元素，但我从现在搬走了。

• I got the idea because I was originally using the Backbone.ModelBinding plugin which used data-bind attributes for dynamic elements, but I am moving away from it now.

我使用的CoffeeScript，骨干网和haml_coffee模板。

I'm using CoffeeScript, Backbone and haml_coffee templates.

我也看过 $（this.el）.find（'[NAME =标题]'）是比选择提供上下文更快

I've also read the $(this.el).find('[name=title]') is faster than providing context to the selector.

后续问题：

<一个href=\"http://stackoverflow.com/questions/9205740/a-convention-for-indicating-whether-an-html-element-is-referenced-from-js-$c$c\">A约定指示是否一个HTML元素从引用的JS code

更新jsperf测试所有建议：

Updated jsperf to test all suggestions:

http://jsperf.com/class-or-name-attr-查找/ 3

推荐答案

搜索DOM元素的name属性可能比阶级，由于需要灒慢一点点 - 这jQuery使用的选择器引擎 - 需要为了解析选择来决定什么需要被发现。滋滋声就需要从字符串[名称=标题]，以确定它首先需要在看被搜查所有元素的属性中的名，而该属性的值是题完全吻合。虽然我已阅读，灒是非常快的它做什么，我只能猜测，这将是比本地JavaScript调用为DOM元素属性慢 - 类（element.className） - 值

Searching the name attribute of a DOM element might be a little bit slower than the class due to the need for Sizzle - the selector engine that jQuery uses - would need to parse the selector in order to determine exactly what needs to be found. Sizzle would need to determine from the string "[name=title]" that it first needs to be looking at the "name" attribute of all elements being searched and that the value of that attribute is "title" exactly. While I have read that Sizzle is very fast what it does I can only guess that it is going to be slower than a native JavaScript call to a DOM element attribute - class (element.className) - value.

要证实我的怀疑我做了一个PERF： http://jsperf.com/class - 或名称ATTR的查找。结果是不是我会怀疑在.find。儿童和电话，但我上文所述似乎至少在前两个例子中得到支持。在生产中code然而，我所看到的性能提升使用最具体的选择时 - 例如。孩子，而不是.find - 因为它不遍历不必要的元素

To confirm my suspicions I made a perf: http://jsperf.com/class-or-name-attr-lookup. The results aren't what I would have suspected on the .find and .children calls but what I stated above seems to be supported in the first two examples at least. However, I have seen performance boosts in production code when using the most specific selector - e.g. .children instead of .find - as it isn't looping over unnecessary elements.

另外，我做了一个试验前一阵子照亮一些不同之处使用一个简单的选择语法和一些比较模糊的和/或jQuery的十岁上下的语法来比较，我认为很有趣绩效之间：的 http://jsperf.com/id-id-vs-id-class/2

Also, I made a test a while ago to illuminate some of the differences between using a simple selector syntax and some more obscure and/or jQuery-ish syntax to compare performance that I thought was interesting: http://jsperf.com/id-id-vs-id-class/2.

我希望有或任何这可以帮助任何人。

I Hope some or any of this helps anyone.

这篇关于在jQuery的是一个坏主意，使用[名称= X]所有选择？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！