Question

当人们使用jQuery创建元素时，我总是看到他们按照$(<div />)的方式做了些什么。为什么？据我所知，$('<div>')同样有效。我错过了什么吗？

Answer 1

这是自动关闭标签的语法。 <div>不应该是自我关闭的，但在这种情况下它没有任何区别。 jQuery支持它，它以相同的方式呈现。

$("<div>")       // = <div></div>
$("<div />")     // = <div></div>
$("<div></div>") // = <div></div>

有关详细信息，请参阅此SO问题：
Why is this jQuery reference '$("<div />")' instead of '$("<div></div>")'?

Answer 2

不，你没有遗漏任何东西。 jQuery很乐意接受它并呈现适当的标记。我想很多人被绊倒的地方是文档建议你使用XHTML兼容元素。

然而，有些人似乎错过了jQuery没有直接传递给document.createElement()。相反，它在它上面运行一个正则表达式（或者至少在我上次检查时运行）并找出实际传递给document.createElement()的内容。

对我来说，创建一个元素没有正确或错误的方法，实际上，你正在传递一些HTML元素的字符串表示。 Resig先生可以很容易地使用$('div');或$('HTML:DIV');或者他当时的感觉。相反，他选择使用“像这个正则表达式将HTML正确翻译成实际HTML的字符串”，因此以下所有内容同样有效：

$('<div>');
$('<div/>');
$('<div></div>');

...并且有效并非因为它们可能符合或不符合XHTML，但因为使用的正则表达式能够将其转换为正确的HTML元素。

Answer 3

永远不会重要。

jQuery（最终）应用以下正则表达式来确定您传递的字符串是否为“单个标记”：

/^<(\w+)\s*\/?>(?:<\/\1>)?$/

如果您传递的字符串与此正则表达式匹配，则jQuery只需使用子模式(\w+)（标记名称），并将其传递给document.createElement()。

<div>，<div />，<div/>和<div></div>都符合此模式，因此它们的处理方式完全相同：createElement('div')。

Answer 4

确保跨浏览器兼容性。如果容器元素未关闭<div></div>或快速关闭<div />，则某些浏览器可能会失败。非容器元素<img>

是不必要的

有关详细信息，请参阅http://api.jquery.com/jQuery/#jQuery2。

<强>校正

对于<div></div>，<div/>和<div>，jQuery会解析它并使用document.createElement。对于任何更复杂的内容，例如<div style="display:none" />或<div><b></b></div>，它将使用innerHTML来创建元素。在这种情况下，容器元素需要正确的标记关闭和嵌套，非容器元素需要可选。如果排除它们，代码可能会在某些浏览器上失败。

由于您可能在某些时候将属性或子元素添加到HTML字符串中，因此最好始终使用标记结束练习来避免意外错误。

Answer 5

您可以使用<div></div>或仅使用<div/>。它们都是一样的。最后一个不那么冗长。

以下是关于结束标记的一些文档：W3C。见3.2.1

HTML5中的相同内容。见8.1.2.2。

在Html中，您需要关闭标记。你有两种方法可以做到。

为什么人们在创建元素时会使用斜杠？

5 个答案: