JQuery class selector vs id selector

У меня есть 7 различных кнопок, которые выполняют одну и ту же функцию javascript при нажатии. должен ли я использовать селектор классов или селектор идентификаторов.JQuery class selector vs id selector

$("input.printing").on("click", function(event) { 
    printPdf(event); 
});

или

$("#package1Pdf").click(function(event) { 
     printPdf(event); 
    }); 
$("#package2Pdf").click(function(event) { 
     printPdf(event); 
    }); 
$("#package3Pdf").click(function(event) { 
     printPdf(event); 
    }); 
$("#package4Pdf").click(function(event) { 
     printPdf(event); 
    });

Каковы преимущества и недостатки каждого из них? Что более предпочтительно.

источник

2013-03-13 Chun ping Wang

Посмотрите на код и скажите нам, честно говоря, что вам будет лучше. Нет правильных или неправильных ответов, это всего лишь личный вопрос, поставленный перед вами, чтобы получить свое собственное мнение по этому поводу. – BoltClock

Если вы захотите, вы также можете сделать '$ (" # package1Pdf, # package2Pdf, # package3Pdf, # package4Pdf "). Click()' – Dom

Его быстрее выбрать элемент по id, но код более аккуратный, когда вы просто связываете функция один раз в классе. В общем, я бы пошел с читабельностью кода, если вам действительно не нужно это (скорее всего, * незначительное *) повышение производительности. – Jack

Вы можете использовать ID фильтр без нескольких селекторов:

$('[id^="package"]').click(printPdf);

выше отберет все идентификаторы, начинающиеся с «пакетом». Это означает, что разница в основном семантическая. Вы должны выбрать то, что наиболее важно для вашего приложения и как оно было разработано.

См. jQuery attribute selectors page, чтобы узнать о гибкости выбора jQuery. Сохранение закладки на этой странице не позволит вам снова написать код, как ваш второй пример.

Что лучше?

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

Аналогичным образом, если вы вместо этого указали элементы с особыми именами и не указали имя описательного класса, которое представляет то, что вы хотите выбрать, а затем используйте идентификатор. Разница в производительности не будет касаться практически любого приложения, включая.

источник

2013-03-13 18:54:00 BinaryTox1n

Очевидно, что ваш первый код с использованием класса намного чище, опрятно и лучше.

ID селектор является самым быстрым, что верно .. но в это время и возраст это не имеет большого значения.

Так что не стоит так беспокоиться о производительности (если это не проблема), и просто используйте тот, который чист и поддерживается.

oh btw, вам даже не нужна эта анонимная функция. Смотрите ниже,

$("input.printing").on("click", printPdf);

источник

2013-03-13 19:03:45

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

источник

2013-03-13 19:04:39 iGanja

Выбор только по идентификатору быстрее, чем выбор по классу в целом, поскольку jQuery под капотом использует getElementById, который быстрее в большинстве браузеров. Для получения дополнительной информации обратитесь к статье this, так как она показывает множество других способов повышения производительности, связанных с JQuery. Однако, пожалуйста, помните, что производительность селектора - это не единственное, что вас беспокоит. Прикрепление ко многим ненужным событиям может также создать проблему с производительностью. Чтобы смягчить эту проблему, вы можете использовать делегат, пожалуйста, просмотрите этот jQuery documentation для получения дополнительной информации о делегате.

источник

2013-03-13 19:08:49 nicholasnet

, как мы все знаем, селектор быстрее и лучше .. но в вас случае .. так как вы выбираете каждый идентификатор 8 раз .. который по сравнению с классом seletor медленнее, как вы можете увидеть here

класса селектор в вашем случае лучше, быстрее и читабельнее ...

примечание: что делать, если вам нужно добавить еще 20 кнопок в ближайшее время (100 будет слишком много) ..... и вы выберите пойти с селектором id ... phewwww !!! то есть, еще 20 обработчиков событий ......;);)

источник

2013-03-13 19:09:16 bipen

JQuery class selector vs id selector

ответ

Смежные вопросы