Подтвердить что ты не робот

Лучшая практика для именования идентификатора атрибутов элементов Dom

Это связано с соглашениями об именах для атрибута id элемента DOM, и я думаю, что атрибут name также используется. Когда дело доходит до JavaScript, из того, что я понимаю и сделал, всегда используется случай верблюда, за исключением имен классов. Классы основаны на Паскале.

Сказав, что я развиваюсь в ASP.NET в основном и здесь, где я сталкиваюсь с проблемой именования для атрибута id. В ASP.NET, если вы перетаскиваете новый серверный элемент управления на страницу (что я редко делаю, я тип разметки своего рода парень), имена по умолчанию всегда Pascal, потому что они должны соответствовать платформе .NET именования для серверного кода.

Итак, когда дело доходит до присвоения имени атрибуту id элементов управления ASP.NET или только элементов разметки, я следую правилу, чтобы верблюд делал атрибут id (рекомендации по именованию Javascript), но это противоречит правилам именования .NET.

Итак, один, какой корпус вы обычно делаете для атрибута id в элементах DOM и два, что делают люди .NET, которые развиваются в ASP.NET, для присвоения имени атрибуту id?

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

<input type="text" id="txtUserName" />

или для флажков, например

<input type="checkbox" id="chkSelectAll" />

Что определенно противоречит рекомендациям по именованию кода на сервере .NET и, возможно, рекомендациям JavaScript.

Любые советы очень ценятся.

4b9b3361

Ответ 1

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

  • Ничего не сокращайте! BW_RCB01_SW означало что-то для команды, которая выполняла наши CSS много лет назад, но теперь это ничего не значит для меня, и мне приходится работать назад, чтобы попытаться перевести то, что соответствует BW_RCB01_SW для моих целей, и либо помните, что перевод или документ где-нибудь. Лучше? blackwhite-boxtype1-bottomleft. Это длиннее, но также не требует камня Розетты.

  • Держите все в нижнем регистре и используйте подчеркивания или дефисы. Я предпочитаю дефисы, но это полностью предпочтение. Не должно быть препятствий для использования дефиса, поскольку они не зарезервированы в CSS или HTML, а идентификаторы рассматриваются как буквальные строки на всех других языках. В нижнем регистре есть весь опыт - слишком много часов впустую задается вопросом, почему черт не будет применять этот стиль. pageContainerLeft не совпадает с pageContainerLeft.

  • Определите, что именно этот элемент, но не более. Подумайте о каждой части информации, которую вы вставляете в название, и необходимо ли это. В вашем примере - вам нужно знать флажок по идентификатору? Вряд ли. Вы уже знаете, к какому элементу вы обращаетесь, потому что это уникальный идентификатор, и вы все равно должны кодировать этот элемент.

Ответ 2

Именование как можно меньшего количества объектов, безусловно, помогает поддерживать чистоту. Если вы можете получить, называя родителя и просто ссылаясь на ребенка, это будет лучше (на мой взгляд). Вы получаете бонус чуть меньше html, оказанных клиенту на каждой странице.

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

Подчеркивания - это символы, в то время как тире можно интерпретировать как минус, так что еще одна потенциальная проблема - имеет смысл придерживаться только подчеркиваний. Например, Flex не принимает XML с атрибутами, названными с тире (я знаю, что это значения, а не атрибуты, но все же безопасная ставка).

Я согласен с выше, хотя - никаких типов элементов или позиционирования или цвета в качестве класса /id. Венгерская нотация == Плохо. Очень полезно определить, что такое идентификатор. Мне нравятся поля формы имен по конкретным объектам - user_login, user_email, user_address_state_id, user_address_country_id и т.д., Возможно, все появятся в форме регистрации пользователя. Обычно неформатные поля недостаточно для подчеркивания, иначе вы могли бы переименовать их.

Ответ 3

Один из гуру HTML на моей последней работе фактически рекомендовал разграничить многословные идентификаторы с тире

<input type="text" id="user-name" />

Я изо всех сил пытаюсь вспомнить, почему - у меня больше нет доступа к этим документам по внутренним стандартам. Я знаю, что на самом деле не отвечает на ваш вопрос о корпусе Pascal vs Camel.

Я бы посоветовал не использовать HN - я считаю, что это отвратительная практика. Что произойдет, если вам нужно изменить свой блок checkbox на элемент select? Теперь идентификатор элемента содержит ложную семантику. Это просто не стоит хлопот, ИМО.

Ответ 4

Верьте или нет, но у меня были проблемы с дефисами как имена имен id и css-классов при использовании определенных библиотек javascript. Это очень редко, но вы, очевидно, хотите избежать чего-то подобного. Из-за этого я использую случай верблюда или подчеркивание. Вы также можете использовать символы подчеркивания.

В противном случае общее правило состоит в том, чтобы иметь содержательные имена, которые легко читаются и понимаются. Когда дело доходит до "элементов управления", убедитесь, что вы выполняете какое-то соглашение об именах. Лично я предпочитаю постфикс над префиксами (т.е. NameText вместо textName), но я стараюсь избегать postfixes, поскольку считаю их слишком подробными.

Итак:  1. Значимые имена.  2. Избегайте пост-префикса.  3. Избегайте сокращений (т.е. Адрес вместо addr).  4. Не торопитесь.

Ответ 5

Вот несколько рекомендаций по именованию, которые помогли мне с моими идентификаторами и классами в DOM:

  • не включают тип имени (т.е. нет txt или chk). Я могу выбрать эту информацию с помощью CSS или jQuery гораздо более descriptivlely
  • используйте символы подчеркивания в качестве разделителей в имени. Дефисы не всегда работают на других языках, а оболочка верблюда немного сложна для чтения в разметке.