Почему используют class вместо явного id?

На многих качественных сайтах вижу использование только классов, вместо id, хотя на странице такой только один элемент. Например, теже wrapper, header, sidebar, везде это классы. Почему id не используется? Спасибо.
  • Вопрос задан
  • 2946 просмотров
Решения вопроса 1
AlexanderTsymbal
@AlexanderTsymbal
tsymbal.su
тут несколько моментов:
1. id имеет очень большой приоритет css. объяснить двумя словами тяжело, но вкратце, если вы задали какие-то свойства для id-селектора #x, что ни пишите в классовом селекторе .y, если он подтягивает стили от id-селектора, то они возьмут верх над классовым селектором. Никакие элементы не должны иметь приоритет над другими. Так удобнее редактировать стили.
2. Есть неписанные "законы" БЭМ, которых придерживаются опытные разработчики. Существует много всяких философий БЭМ, самая популярная - яндексовская - погуглите. БЭМ позволяет лучше разбираться в коде, работать с препроцессорами и производить более удобные операции при работе в js.
...ну есть и еще несколько моментов.

Главное отличие id от class в том, что стили id нужно задавать для одного элемента, уникального. А class можно применять для нескольких элементов. Даже если при разработке блок один, никогда не угадаешь, возможно придётся добавлять примерно такой же блок где-нибудь еще на странице - в таком случае id дублировать нельзя - ошибка css.

Вообще, товарищи, используйте id никогда! Class куда удобнее и гибче (хотя бы в том плане, что для одного элемента можно задавать хоть 255 классов одновременно). Придумывались CSS-селекторы в конце 90х годов. Тогда HTML был совершенно на другом уровне, и разработчики смотрели в другую сторону. Им тогда хотелось управлять DOM с помощью JS методом GetElementByID - сейчас этот метод в чистом виде никто не использует. Есть жквери!
Ответ написан
Пригласить эксперта
Ответы на вопрос 3
Tiendil
@Tiendil
Разработчик ПО.
для однообразности
сегодня один, завтра два, послезавтра 10
Ответ написан
@Kostik_1993
Fullstack Web Developer | PHP | Laravel | Vue.js
id это уникальный идентификатор, предназначенный скорее для JS нежели CSS, например в каталоге у каждого товара будет вид
<ul>
<li id="1" class="product"></li>
<li id="2" class="product"></li>
<li id="3" class="product"></li>
<li id="4" class="product"></li>
<li id="5" class="product"></li>
<li id="6" class="product"></li>
</ul>

где с помощью класса мы задаем всем элементам одинаковый вид, а при клике по кнопке купить посылаем id товара в корзину
Ответ написан
А почему в PHP и Js нет статической типизации?
На самом деле фундаментальные корни одни и те же. Web-разработчики привыкли к постоянному бардаку и хаосу в своих продуктах. Никогда нельзя сказать, сколько завтра будет таких элементов на странице, даже если сегодня он один. Вот есть у вас #popup. Завтра заказчик просит добавить всплывающую форму и вы быстренько вставляете еще один #popup... Это заканчивается неявными проблемами.
Если бы браузер увидев дублирование id "падал" бы отказываясь отображать страницу и выбрасывал бы исключение, таких бы проблем не возникало. Но разрабы браузеров стараются отобразить страницу любой ценой - игнорировать дубли id, закрывать не закрытые теги и т.п.
Это делает подобные ошибки неуловимыми и разработчики вынуждены писать код который бы свел к минимуму саму возможность их появления.
Весь веб это пример индустрии говнокода, и отнюдь не потому, что нет хороших разрабов. Их вполне достаточно. Но сама идеология веба такова, что заставляет создавать говнорешения.
Нет стандартов, а те что есть не соблюдаются. Код решений находится в состоянии перманентной разработки и рефакторинга прямо в продакшене. Разработчики в проектах часто меняют друг-друга. И при все при этом требования к функционированию и отказаоустойчивости очень жесткие - ошибка приводит к проблемам сразу на многих машинах многих пользователей.
Результат этого ровно то, что мы имеем.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы