$ ('<element>') vs $('<element/">') в jQuery

Ответ 1

Нет никакой разницы, как показано в исходном коде, строка 30 и строка 121:

/* Line 30*/
rsingleTag = /^<(\w+)\s*\/?>(?:<\/\1>)?$/,

/* Line 121 */
// If a single string is passed in and it a single tag
// just do a createElement and skip the rest
ret = rsingleTag.exec( selector );

Следующие эквиваленты:

• <a></a>
• <a />
• <a>

Ответ 2

Технически $('<element></element>') более корректен, поскольку в HTML5 был удален сам закрывающий теги с использованием /, но это не имеет никакого значения, потому что этот оператор анализируется jQuery. Если что-либо, просто использование $('<element>') может быть немного быстрее, потому что это меньше символов для чтения. Который также должен пропустить некоторые условия Regex.

Еще лучше, если вы ищете самый быстрый способ использования jQuery:

var temp = new jQuery.fn.init();
temp[0] = document.createElement('element');
temp.length = 1;

Эта версия самая быстрая, поскольку она пропускает jQuery(), которая обертывает "новый jQuery.fn.init()" и не передает никаких аргументов, чтобы немедленно вернуть новый объект jQuery. Он пропускает множество условий и отказоустойчивых утверждений, которые не нужны, если вы уже точно знаете, что вы пытаетесь сделать.

Или немного короче:

var temp = $(document.createElement('element'));

Эта версия немного медленнее, но гораздо легче читать и много опереться. Он по-прежнему пропускает большой кусок кода, используемый для синтаксического анализа, что бы передать строку. Вместо этого jQuery может просто знать, что мы работаем с node здесь.

Ссылка
HTML5 НЕ разрешает теги "Self-Closing"
Google: html5 самозакрывающиеся теги
jsperf

Ответ 3

Нет, это не имеет никакого значения, пока определение элемента хорошо сформировано. Второй стиль - это просто альтернативный синтаксис, который может на самом деле сохранить нажатие клавиш:

$('<a href="herp.derp.com/sherp"/>');    // XML-like syntax
$('<a href="herp.derp.com/sherp"></a>'); // Well-formed HTML
$('<a href="herp.derp.com/sherp">');     // Malformed (no closing tag)

Ответ 4

Вот что говорят об этом jQuery docs:

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

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

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

$('<a/>');

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

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

См. этот вопрос, однако, о том, что наиболее эффективно:

Каков наиболее эффективный способ создания элементов HTML с помощью jQuery?

Ответ 5

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

jsperf faq: http://jsperf.com/faq

конечный результат: тест jsperf

Ответ 6

Сокращенный элемент <element /> требует косой черты, потому что он заменяет <element> </element>. Таким образом, вы должны писать, где это целесообразно, для правильной разметки. Но это не должно быть так или иначе.

Отредактировано: на самом деле это не проблема. другие здесь, похоже, согласны с тем, что это вопрос эффективности регулярных выражений