Несколько атрибутов класса в HTML
Что происходит, когда элемент имеет несколько атрибутов class?
<div id="test" class="one two three" class="four">
Я пытаюсь добавить класс в вывод post_class(); в плагине WordPress, но сама функция создает всю часть class="one two three"
Эквивалентно ли это class="one two three four"?
Или выигрывает первый или второй?
Или это неопределенное поведение, и в этом случае что делают основные браузеры?
Если вы знаете правильный способ добавления класса в этот фрагмент (плагин WordPress), то это также будет ценю!
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
2 answers
Что происходит, когда элемент имеет несколько атрибутов класса?
Когда атрибут объявляется несколько раз для одного элемента (что, кстати, является недопустимым HTML-кодом), в поведении первое значение переопределит все последующие значения для одного и того же атрибута. Так что в этом случае у вашего элемента будут только классы one two three.
Это поведение объясняется в спецификации HTML5, 8.2.4.35 Состояние имени атрибута, "...если уже есть атрибут на [элемент] с точно таким же именем, тогда это ошибка синтаксического анализа, и новый атрибут должен быть удален..."
Если вы знаете правильный способ добавления класса в этот фрагмент (плагин WordPress), то это также будет оценено!
Как правило, если вам нужно динамически добавлять пользовательские классы в свои сообщения WordPress, вы подключаетесь к фильтру post_class и при необходимости манипулируете массивом $classes. Вот как это примерно выглядит в моих темах:
function nv_post_class( $classes ) {
// Most recent post on the front page
global $count;
if ( is_home() && 1 == $count )
$classes[] = 'latest-post';
return $classes;
}
add_filter( 'post_class', 'nv_post_class' );
Если вы нужно только добавить один или несколько статических классов, передать их в виде строки, разделенной пробелами, непосредственно в post_class():
<div id="post-<?php the_ID(); ?>" <?php post_class( 'myclass1 myclass2' ); ?>>
Подробнее об этом в Кодексе WordPress.
Тогда документ будет недействительным, и браузер попытается выполнить восстановление после ошибки.
Из спецификации HTML 5:
Если имя атрибута уже есть в списке атрибутов, вернитесь к шагу с надписью атрибуты.
Итак, если используется синтаксический анализатор HTML 5, должен применяться первый атрибут.