下面的例子中，“<ul/>”是拼写错误还是有特殊含义？

Question

getJSON (https://api.jquery.com/jquery.getjson/) 的文档包含以下代码：

$( "<ul/>", {

哪个看起来应该是 </ul>？或者这有什么特殊的含义，比如它是某些东西的快捷方式，或者斜杠用作转义字符？

$.getJSON( "ajax/test.json", function( data ) {
  var items = [];
  $.each( data, function( key, val ) {
    items.push( "<li id='" + key + "'>" + val + "</li>" );
  });

  $( "<ul/>", {
    "class": "my-new-list",
    html: items.join( "" )
  }).appendTo( "body" );
});

Answer 1

这是一件 jQuery 的事 - 请参阅我的回答了解更多信息。本质上它所做的是创建一个开始和结束 <ul></ul> 标记，但它更简洁。我修改了我的链接答案以显示您的示例的工作原理。从这个 JS 开始：

document.createElement("ul");

然后，您可以 jQuery 像这样：

$("<ul></ul>");

而且因为它是jQuery，而且越来越简洁，它最终变成了它的紧凑、自闭的符号：

$("<ul/>");

您拥有自闭合标签的另一个原因是因为它是一个空元素 - 它没有子元素。所以它是一个自闭合标签的原因是因为它是您正在创建空元素的标志。

代码的每一位的作用如下：

$( "<ul/>", {...})

如上所示，这将创建一个空的 <ul></ul> 元素。

"class": "my-new-list"

这会将 class my-new-list 添加到元素中，因此它看起来像：

<ul class="my-new-list"></ul>

这一行：

html: items.join("")

将 <ul></ul> 元素的 innerHTML 属性设置为连接成单个字符串的 items 数组。

最后，这一行：

.appendTo("body");

将元素附加到页面正文。现在，我们的元素看起来像：

<ul class="my-new-list">TheItemsArray</ul>

它被插入到 <body> 元素的最后，就在结束 </body> 标记之前。

Answer 2

在 HTML 中，<tag/> 被称为 "self-closing tag"，这意味着一个项目实际上可以是独立的。例如，在原始 HTML 中，可以将图像写为 <img/>（即使 <img> 也可以）。

因此，<tag/> 意味着标记元素不需要开始或结束标签，因为开始或结束标签根本没有意义，或者只是当没有插入任何内容时之间。例如，<img/> 是一个自闭合标签的原因是因为在图像中插入一些东西在开始和结束标签之间是没有意义的。

同样的想法可以应用于 JQuery 中的 <ul/> 项目。当创建一个空的 ul 元素时，empty 的定义意味着没有任何东西可以插入到 ul 元素中，所以 JQuery 只是继续并将它初始化为 <ul/>.

相比之下，它是 </ul> 的拼写错误的想法在代码中没有意义，因为 </tag> 表示右括号，并且没有提到左括号。

所以，总之 (tl;dr)，<tag/> 是 HTML 中的实际事物，指的是自闭合元素。

下面的例子中，“<ul/>”是拼写错误还是有特殊含义？

In the following example, is "<ul/>" a typo or does it have special meaning?

html

javascript

jquery

webpage