jQuery: при создании нового элемента мне нужен конечный тег?

Question

var $div = $('<div class="error">').appendTo($('#header'));

При создании новых элементов и добавлении их в DOM вам нужен конечный тег? Почему или почему нет? Мне нужен только конечный тег, если я помещаю контент в тег, который я создаю? вот так:

var $div = $('<div class="error"> Error-Homie! </div>').appendTo($('#header'));

или я мог бы создать элемент с содержанием в нем, но пропустить конечный тег? Хорошо? Плохой?

var $div = $('<div class="error">').appendTo($('#header'));

Answer 1

Хотя это может работать, если вы не используете закрывающий тег (или, по крайней мере, самостоятельно закрываете тег), вы должны добавить закрывающий тег (самозакрытие) (как уже упоминалось, для кросс-платформенной совместимости):

Чтобы обеспечить кросс-платформенную совместимость, фрагмент должен быть правильно сформирован. Теги, которые могут содержать другие элементы, должны быть связаны с закрывающим тегом:

$('<a href="http://jquery.com"></a>');

В качестве альтернативы, jQuery допускает синтаксис XML-подобного тега (с пробелом или без пробела перед косой чертой):

$('<a/>');

Теги, которые не могут содержать элементы, могут быть быстро закрыты или нет:

$('<img />');
$('<input>');

Вот как jQuery создает элементы:

Если HTML более сложный, чем один тег без атрибутов, как в приведенном выше примере, фактическое создание элементов обрабатывается браузером. innerHTML механизм. В большинстве случаев jQuery создает новый элемент и устанавливает innerHTML свойство элемента во фрагмент HTML, который был передан. Когда параметр имеет один тег, такой как $('<img />') или же $('<a></a>'), jQuery создает элемент, используя собственный JavaScript createElement() функция.

---

Btw. Вы также можете передать данные в качестве второго параметра:

$('<div />', {'class': 'error', text: 'Error-Homie!'})

Answer 2

Вам нужен конечный тег: http://api.jquery.com/appendTo/ например

$('<p>Test</p>').appendTo('.inner');

это также должно быть

.appendTo('#header');

и не

.appendTo($('#header'));

Answer 3

Вы всегда должны иметь конечный тег, чтобы иметь правильный HTML.

Но фактом является то, что большинство браузеров допускают такие ошибки. Это не причина быть ленивым, однако, вы не должны полагаться на терпимость браузеров для работы вашего кода. Этот допуск существует для возможности отображения сайтов с несколькими ошибками, чтобы не предупреждать заведомо неверный код.

Answer 4

Вы, вероятно, можете сделать это так

$('<div/>',{class:'error'}).html('Error-Homie!').appendTo($('#header'));