Каков более быстрый способ пересечения элемента DOM?

Question

Допустим, у меня есть разметка, как это:

<div id="comment_box"> 
     <div class='comment'> 
      <ul> 
       <li class='comment_1'> 
        </li> 
       <li class='comment_2'> 
        </li> 
       <li class='comment_3'> 
        </li> 
       <li class='comment_4'> 
        </li> 
      </ul> 
     </div> 
    </div> 

commentBox = $ ('# comment_box')

$ ('comment_3' , commentBox) или commentBox.find ('. Comment_3') или любой другой более быстрый способ?

Answer 1

Вот некоторые моменты, которые мы должны иметь в виду при выборе элементов с помощью JQuery:

1.Choosing селекторов

Выбор хороших селекторов один способ улучшить в JavaScript представление. Небольшая специфика - например, включая тип элемента при выборе элементов по имени класса - может пройти долгий путь. С другой стороны, слишком большая специфика может быть плохой.

селектор, таких как

$ ('# comment_box .comment li.comment_3') является излишним,

, если селектор, такие как

$ ('# comment_box li.comment_3 ') выполнит свою работу.

jQuery предлагает множество селекторов на основе атрибутов, позволяющих выбирать на основе содержимого произвольных атрибутов с использованием упрощенных регулярных выражений.

По возможности сделайте выбор, используя идентификаторы, имена классов и имена тегов.

2.Saving Выбор

JQuery не кэширует элементы для вас. Если вы сделали выбор, который может понадобиться сделать снова, вы должны сохранить выбор в переменной, а не повторять выбор.

var commentBox = $ ('# comment_box');

В приведенном выше примере имя переменной начинается со знака доллара. В отличие от других языков, нет ничего особенного в знаке доллара в JavaScript - это просто еще один символ. Здесь он используется, чтобы указать, что переменная содержит объект jQuery. Эта практика является просто конвенцией и не является обязательной.

Как только выбор хранится в переменной, вы можете вызывать методы jQuery для переменной так же, как вы бы назвали их в исходном выборе.

Выбор выбирает только те элементы, которые находятся на странице во время выбора. Если элементы будут добавлены на страницу позже, вам придется повторить выбор или иначе добавить их в выборку, хранящуюся в переменной. Сохраненные выделения не изменяют магию при изменении DOM.

Вы можете обратиться связать http://learn.jquery.com/using-jquery-core/selecting-elements/ для более подробной информации

Answer 2

Ну, есть различные подходы. Лично я бы с этим:

$("#comment_box .comment_3")

Answer 3

Обычно более конкретно вы, тем лучше. Так, например:

$('#comment_box .comment li.comment_3')