2013-11-13 2 views
1

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

<div id="slideshow1" class="slideshow"> 
    <div id="left" class="slideshow-arrow"></div> 
    <div id="right" class="slideshow-arrow"></div> 
</div> 
<div id="slideshow2" class="slideshow"> 
    <div id="left" class="slideshow-arrow"></div> 
    <div id="right" class="slideshow-arrow"></div> 
</div> 

я сделал пример с JS здесь и все, кажется, работает хорошо ..

http://jsfiddle.net/6YPsX/

, если они были вложены в тот же элемент, то уникальные идентификаторы будет иметь смысл, но сделать идентификаторы действительно должны быть уникальными для всего документа?

+5

Yes..Id должны быть уникальными в документе http://www.w3.org/TR/html4/struct/global.html#adef-id – Ramesh

+1

, если они элементы вложены как это ... дублировать идентификаторы по-прежнему плохой практике :) попробуйте добавить влево/вправо в качестве дополнительного класса – KURN

+3

Если вы вызываете 'document.getElementById ('left')' какой элемент вы думаете, что получите? – robertc

ответ

1

Плохая практика не проходит проверку W3C, и это становится еще хуже, когда вы пытаетесь реализовать JavaScript. Просто используйте вместо этого имя класса или укажите им разные имена.

2

Вы можете иметь несколько классов в одном элементе

<div id="slideshow1" class="slideshow"> 
    <div class="slideshow-arrow left"></div> 
    <div class="slideshow-arrow right"></div> 
</div> 

CSS

.slideshow-arrow { 
    background: none top left no-repeat; 
    width: 20px; 
    height: 20px; 
} 
.slideshow-arrow.left { 
    background-image: url('...'); 
} 
.slideshow-arrow.right { 
    background-image: url('...'); 
} 
3

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

Атрибут ID имеет несколько ролей в HTML:

  • Как селектор таблицы стилей. В качестве целевого якоря для гипертекстовых ссылок.
  • В качестве средства ссылки на конкретный элемент из сценария.
  • В качестве имени объявленного элемента OBJECT.
  • Для обработки общего назначения пользователем агентов (например, для идентификации полей при извлечении данных из HTML страниц в базу данных, перевод документов HTML в другие форматы, и т. Д.).

link to w3 site

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