Сортируемый селектор jQuery («id» или «class»)? - PullRequest
Новая
       28

Сортируемый селектор jQuery («id» или «class»)?

6 голосов
/ 07 ноября 2011

У меня есть несколько списков, которые можно сортировать, и я могу перетаскивать элементы в каждый список.

Настройка выглядит примерно так: 

<ul id="sortable1" class="connectedSortable">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>

<ul id="sortable2" class="connectedSortable">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>

JavaScript прост и выглядит так

(следующие примеры с сайта jQuery) 

<script>
$(function() {
    $( "#sortable1, #sortable2" ).sortable({
        connectWith: ".connectedSortable"
    }).disableSelection();
});
</script>

пока все хорошо ...

ВОПРОС:

Могу ли я использовать в качестве селектора jQuery класс ul вместо двух идентификаторов списка ??

Что-то вроде: 

<script>
$(function() {
    $( ".connectedSortable" ).sortable({
        connectWith: ".connectedSortable"
    }).disableSelection();
});
</script>

Это будет правильно?

Я пробовал это, и это работает ...

... но мне интересно почему веб-сайт jQuery приводит пример с обоими идентификаторами списков в качестве селектора, а не только с именем класса ?? Могу ли я столкнуться с проблемами совместимости, если я использую класс в качестве селектора?

Преимущество использования имени класса в качестве селектора состоит в том, что мне не нужно заранее знать идентификаторы списков и теоретически можно создавать новые списки на лету?

Какова будет лучшая практика и что-то вроде "доказательства ошибок"?

Большое спасибо!

1 Ответ

2 голосов
/ 07 ноября 2011

Выбор по классу в порядке, и ваш сценарий правильный.

У меня никогда не было проблем с совместимостью при выборе элементов по классу.

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

Когда вы указываете элементы по идентификатору, вы уверены, что выбрали только те элементы, которые вы хотели. Так что это может быть полезно, когда вы точно знаете, с какими элементами DOM вы хотите соответствовать, и знаете их идентификаторы; как вы заметили, это может быть невозможно, если вы создаете элементы на лету.

Я думаю, что в вашем случае лучше всего использовать имена классов. Не используйте имя класса, с которым вы сопоставляете в CSS; если он отвечает за форматирование, вы (или другие члены вашей команды) можете забыть об изменениях в поведении, которые он дает, и использовать его для других, не связанных между собой элементов, только для одного только форматирования. Это может привести к ошибкам. Лучше иметь отдельные классы «поведения» и «представления», использовать классы представления в CSS и классы поведения для выбора элементов в jQuery.

...