Я только заметил, что в soundcloud кнопки "action" на дорожке (например, repost и т.д.) - все теги кнопок html. Более того, они не являются ни внутри формы, ни связаны с формой a la html5 и не представляют форму (они, по-видимому, обрабатываются через javascript). Является ли это допустимым HTML? Может ли кнопка существовать без формы? Или это просто делает эти кнопки просто интерактивными div? И насколько действительным/неутвержденным было бы это для чтения с экрана?
Являются ли теги html за пределами формы действительными?
Ответ 1
A button элемент действителен в любом месте тела документа, где может отображаться разметка на уровне текста. Такой элемент не должен иметь никакого отношения к элементу form. В настоящее время авторитетной ссылкой является спецификация HTML 4.01, а формальные правила находятся в DTD, но вы можете воспользоваться ярлыком и использовать W3C Markup Validator, чтобы проверить, действительно ли документ.
Если элемент не связан с формой, элемент button не сильно отличается от элемента span (а не div, который по умолчанию является блочным), но button имеет специальный рендеринг по умолчанию. Браузеры и вспомогательное программное обеспечение могут относиться к button как к другим специальным требованиям, и безопаснее использовать button только для элементов, которые должны запускать некоторые действия при нажатии. Напротив, такие элементы часто лучше всего представлены с использованием разметки button, хотя вы можете создавать визуально кнопки-подобные элементы другими способами (изображения или CSS, в основном).
За пределами формы элемент button имеет type=button по умолчанию (и обычно это единственный разумный type для него). Это означает, что это может иметь эффект только через JavaScript. Это никоим образом не делает его недействительным. Тем не менее, вы можете подумать о создании таких кнопок с помощью JavaScript вместо их статического содержимого HTML, чтобы при отключении сценариев не было (правильной, но) запутанной кнопки, которая ничего не делает.
Чтобы уточнить вопросы в комментарии ниже:
ЭлементA button type=button похож на input type=button; разница в том, что последний не имеет содержимого, но отображает текст, показанный на кнопке, из атрибута value, тогда как button имеет контент, который может быть "богатым" (с разметкой).
Для любого элемента, если его использование вызывает действие сервера (как правило, через вызов Ajax), мы действительно можем спросить, как страница работает с отключенным JavaScript. Но этот вопрос может быть неактуальным (возможно, страница - это приложение, которое, как предполагается, должно работать с JavaScript в любом случае), и в любом случае формальная ошибка в этой идее отсутствует.
Почему они существуют? Я бы сказал, для удобства автора и по устаревшим причинам. Аналогично, можно спросить, почему HTML имеет атрибуты событий вообще, когда они не могут работать без сценариев на стороне клиента, и вы можете назначить обработчики событий для элементов в JavaScript. Но в первые дни это было невозможно, и даже в настоящее время было бы удобнее использовать элемент button или onclick, чем делать что-то в JavaScript (и для того, чтобы элемент выглядел как кнопка, CSS). Существует также точка, в которой button и input type=button создают зависящие от браузера элементы для элементов, и можно утверждать, что для большинства пользователей все, что имеет стиль стиля браузера по умолчанию для кнопок, воспринимается как кнопка.
Ответ 2
Да. С очень долгого времени.
От whatwg.org:
Контексты, в которых этот элемент можно использовать:
Если ожидается, что будет отображаться контент.
В эпоху ajax большинство входов не просто отправляются, отправляя форму. И большинство кнопок просто используются для выполнения действия при нажатии при использовании распознаваемого виджета.