Ответ
Использование div вместо button нарушает семантику HTML и создаёт проблемы с доступностью. Кнопки (button) имеют встроенные ARIA-роли и состояния, поддерживают фокус и клавиатурные события (Enter/Space) без дополнительного кода.
Пример проблем:
<!-- Плохо: -->
<div onclick="submitForm()">Отправить</div>
<!-- Хорошо: -->
<button type="button" onclick="submitForm()">Отправить</button>
Различия:
- Доступность: скринридеры распознают
buttonкак интерактивный элемент - Фокус: кнопки автоматически включаются в tab-порядок
- Поведение: кнопки корректно обрабатывают состояния disabled
- Семантика: поисковики лучше понимают назначение элемента
Для стилизации лучше модифицировать button, а не заменять его div.
Ответ 18+ 🔞
Слушай, а вот это реально пиздец как бесит, когда вместо нормальной кнопки лепят div! Ну серьёзно, ёпта, будто button — это какой-то позорный элемент, а этот уродливый div с onclick — верх инженерной мысли!
Представь, ты слепой и слушаешь сайт через скринридер. А он тебе: «Блок. Отправить». И всё. А где кнопка-то, блядь? Где состояние? Нажата она или нет? А этот твой div про всё это нихуя не знает! Это как пытаться есть суп вилкой — вроде столовый прибор, но нихуя не работает как надо.
Вот смотри, какой пиздец:
<!-- Это говно: -->
<div onclick="submitForm()" class="btn">Отправить</div>
<!-- А это красота: -->
<button type="button" onclick="submitForm()" class="btn">Отправить</button>
Разница, блядь, как между «Муму» и утопленной Муму! Первый вариант — это немой Герасим, который только мычит и нихуя не может нормально объяснить. А второй — это уже полноценный человек, который и в табуляцию встанет, и скринридеру честно скажет «я кнопка, сука!», и даже если его disabled сделаешь, он спокойно откинется и скажет «я, блядь, выключен, не трогай меня».
А эти умники ещё и стилизовать не умеют! «Ой, у button свои стили по дефолту, фу!». Да ебать твои старые костыли, возьми и обнули их! Это же одна строчка в CSS:
button.btn {
all: unset; /* Или более аккуратный сброс */
/* А дальше лепи свои модные стили, как на том уродском div! */
}
Вот и весь секрет, в рот меня чих-пых! Не надо выдумывать велосипед с квадратными колёсами, когда уже сто лет как придумали нормальную телегу. Используй button для действий, a для переходов, а div оставь для того, для чего он создан — просто делить хуйню на куски. Не будь распиздяем, делай нормально!