Question

我知道在jQuery中创建HTML元素的方法有很多种，但我看到人们要么显示：

$("<div></div>", {attrs...})

或

$("<div/>", {attrs...})

作为这样做的主要方法。

我发现了

$("<div>", {attrs...})

也很好。

为什么没有人展示第三种方法？它有潜在的问题吗？至于它所记录的结果，当我检查元素以查看创建的div时，它看起来大致相同。

Answer 1

创建包含$('<div>')，$("<div>", {attrs...}) 等标记的html元素，这是创建html elmenets的记录方式，请检查here。

当参数包含单个标记（带有可选的结束标记或快速关闭）时 - $("<img />")或 $("<img>") ，$( "<a></a>" )或 { {1}} - jQuery使用本机JavaScript createElement（）函数创建元素。

Answer 2

让我们看一下jQuery源代码：

https://github.com/jquery/jquery/blob/master/src/core.js#L85

// Handle HTML strings
if (typeof selector === "string") {
  if (selector.charAt(0) === "<" && selector.charAt(selector.length - 1) === ">" && selector.length >= 3) {
    // Assume that strings that start and end with <> are HTML and skip the regex check
    match = [null, selector, null];
  }
  // ...
}

所以字符串必须以＆lt;并以＆gt;结束被视为HTML。所有这些变体都是有效的。我认为<div>最不受欢迎的原因是它提醒人们未封闭的标签，这是无效的HTML。但jQuery接受它。

Answer 3

如果你正在做$('<div>')，jQuery也会使用document.createElement()。

（只需看看http://code.jquery.com/jquery-1.4.2.js，第117行）。

有一些函数调用开销，但除非性能至关重要（你创建了数百[数千]个元素），否则没有太多理由可以恢复到纯DOM。

只是为新网页创建元素可能就是你最好坚持使用jQuery的做事方式。

Answer 4

根据jQuery documentation：为确保跨平台兼容性，代码段必须格式正确。可以包含其他元素的标记应与结束标记配对。

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

但是不能包含元素的标签可以快速关闭或不按如下方式关闭：

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

虽然<div>，但</div>可能在某些浏览器中适用于您，但结果可能会因浏览器而异，甚至可能在同一浏览器的不同版本中有所不同。为安全起见，请始终坚持标准和文档最佳做法

jQuery创建HTML元素

4 个答案: