Мнение: в HTML, возможные повторяющиеся идентификаторы или нестандартные атрибуты?

Довольно часто хочется, чтобы ваш javascript знал, что конкретный dom-узел соответствует записи в базе данных. Итак, как вы это делаете?

Один из способовя видел этоДовольно распространенным является использование класса для типа и идентификатора для идентификатора:


 myThing = select(".thing#5") 

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

Альтернативой является использование атрибутов данных:


 myThing = select("[data-thing-id=5]") 

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

Ответы на вопрос(10)

Учитывая тот факт, что вы можете иметь несколько классов на элемент, не можетВы создаете уникальный идентификатор в качестве дополнительного класса для каждого элемента? Таким образом, может быть более одного элемента с одинаковымЯ бы" без коллизий атрибутов HTML ID.




Тогда было бы легко найти эти узлы и найти соответствующую им запись в БД с небольшими манипуляциями со строками.

 Matthew Crumley10 авг. 2010 г., 17:51
@ Джон: Но если у вас есть дублированные идентификаторы, вы бы нене сможет использовать.document.getElementById
 John Sheehan10 авг. 2010 г., 19:13
Я не былНе выступая за использование нескольких идентификаторов, просто имейте в виду, что выбор по классам медленнее в нетрадиционных браузерахмедленнее гораздо дольше)
 John Sheehan03 окт. 2008 г., 07:37
Помните, что выбор по классу намного медленнее, чем выбор по ID

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

Создание идентификатора уникальным путем добавления имени типа к идентификатору будет работать, но вам нужно спросить, зачем вам это нужно. Предоставление идентификатора элемента очень полезно, когда элемент должен быть найден, getElementById очень быстро. Причина в том, что большинство браузеров создают индекс идентификаторов по мере загрузки DOM. Однако, если у вас есть миллионы идентификаторов, которые вам никогда не понадобятся для чего-то вроде getElementById, тогда вы 'Мы понесли расходы, которые никогда не возвращаются.

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

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

если выпользуетесь XHTML и не торопитесь расширять DTD, которое выиспользовать для покрытия новых атрибутов. Лично яЯ просто использовал более уникальный идентификатор, как предлагали некоторые другие люди.

Вы'Откажусь от контроля над DOM

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

var whoKnows = document.getElementById('duplicateId');

Поведение на самом деле отличается, в зависимости от браузера. В любом случае вы можете использовать classNames для повторяющихся значений, и выбудуизбежать проблемы в целом.

Браузер будет пытаться игнорировать ошибки в вашей разметке, но все становитсягрязный и более сложный, Лучше всего, чтобы ваша разметка действовала. Вы можете описать как тип элемента, так и его уникальный идентификатор базы данных в className. Вы могли бы даже использоватьнесколько classNames различать их. Естьмного действительных возможностей:



или же



или же



или же



Все это совершенно законно и допустимые фрагменты XHTML. Обратите внимание, что в последнем фрагменте яУ меня все еще есть ID, работающий на меня, и это хорошо. Доступ к элементам по их идентификатору очень быстрый и простой, поэтому вы определенно хотите использовать его, когда можете.

Вы'Я буду тратить достаточно времени на JavaScriptубедившись, что тыу нас есть правильные значения и типы, Размещение дубликатов на странице только усложнит вам задачу. Если вы можете найти способы написания стандартизированной разметки, она имеет многопрактические преимущества.

Решение Вопроса

что идентификатор не может начинаться с цифры, поэтому:


неверный HTML. УвидетьКакие допустимые значения для атрибута id в HTML?

В вашем случае я бы использовал ID 'какthing5 или же .thing.5

 ahren19 февр. 2013 г., 07:12
Хотелось бы отметить, что в настоящее время идентификатор может начинаться с цифры. Для будущих пользователей ссылка.
 llamerr25 мар. 2013 г., 13:31
+1 за изменения html5,mathiasbynens.be/notes/html5-id-class Остались только требования - кроме того, чтобы быть уникальным в документе - в том, что значение должно содержать хотя бы один символ (можетне может быть пустым), и что это можетне должно содержать пробелов.

Я нене нравитсяДжона Милликина решение. Это'на больших наборах данных будет интенсивно работать.

Оптимизация в его коде могла бы заменить регулярное выражение вызовомsubstring() так как первые несколько символов свойства id являются постоянными.

буду идти с соответствиемclass а затем конкретныйid хоть.

 cllpse03 окт. 2008 г., 12:36
Также: jQuery использует встроенную функцию document.getElementsByClassName (которая, я полагаю, также реализована в WebKit). Джон Милликинс решением нет.
 cllpse03 окт. 2008 г., 12:29
Оптимизация Джона Милликинакод, яЯ предлагаю, это менее интенсивно производительности. Выполнение вызова substring () по сравнению с вызовом объекта регулярного выражения дешевле. Также; Он's оценивает выражение каждый раз, когда он хочет извлечь идентификатор.
 roenving03 окт. 2008 г., 12:38
Ах, я вас неправильно понял, но в основном я бы использовал .getElementById, потому что у вас есть вся необходимая информация, чтобы сделать это таким образом
 cllpse03 окт. 2008 г., 12:26
Полагаю, вы имеете в виду МЕНЬШУ производительность. В таком случае:
 roenving03 окт. 2008 г., 12:02
Я нене понимаю, как это решение будет более ресурсоемким, так как выникогда не сделаю ничего, кроме тебяЯ буду делать с другими решениями (где упомянутые способы используют накладные расходы с библиотекой! -) Я '

помните, что эти идентификаторы являются глобальными переменными, так что если естьесть ли шанс, что кто-то ещеСценарий может найти свой путь на вашей странице, этоуязвимы. Для достижения наилучших результатов загрузите ваши данные в объект внутри анонимной функции и запишите таблицу (или большой вложенный список DIV) после этого.




    
        <meta charset="utf-8">
        <title></title>
        <script>
            window.addEventListener("DOMContentLoaded", function() {
                var thing5 = document.evaluate('//*[@data-thing="5"]', 
                document, null, XPathResult.FIRST_ORDERED_NODE_TYPE ,null);
                alert(thing5.singleNodeValue.textContent);
            }, false);
        </script>
    
    
        <div data-thing="5">test</div>
    



// Get thing on the page for a particular ID
var myThing = select("#myapp-thing-5");

// Get ID for the first thing on the page
var thing_id = /myapp-thing-(\d+)/.exec ($('.thing')[0].id)[1];
 John Sheehan03 окт. 2008 г., 07:38
Определенно сделайте это так. Выбор по идентификатору - самый быстрый способ выбора элемента (пока все браузеры не примут собственные функции выбора классов)
 cllpse03 окт. 2008 г., 11:34
Похоже, что это решение сильно увеличивает производительность на больших наборах данных. // downvote.

Если вы устанавливаете нестандартные свойства, убедитесь, что вы установили их программно (так как все будет разрешено), или попробуйте изменить dtd! -)

Но я бы использовал ID со значащим словом, предшествующим DB-id, а затем использовал бы .getElementById, так как вся необходимая информация под рукой ...

Ваш ответ на вопрос