jquery .append 自动渲染结束标签

Question

我正在使用 .append 将 html 添加到 div。但是当我使用 .append 时，标签也将被关闭。例如，第一行将呈现 <li></li> 而不是 <li>

如何解决这个问题。是否有另一种方法来呈现我的嵌套 UL/LI

JavaScript

$("#test_UL").append("<li>");
$("#test_UL").append("<a href='#'><span>link</span></a>");
$("#test_UL").append("<ul>");
//more stuff an foreach to render list items

$("#test_UL").append("</ul>");
$("#test_UL").append("</li>");

Answer 1

同样的事情你必须做不同的事情：

$('<li>',{
    html:'<a href="#"><span>link</span></a>'
}).appendTo('#test_UL');

因为当您在 jQuery 包装器中传递任何 html 字符串时，它被认为是创建一个元素，因此如果您不放置它，它会动态添加一个结束标记。所有这些都是相同的：

var html = $('<li>')
var html = $('<li/>') 
var html = $('<li></li>')

实际上在幕后 jQuery 使用 document.createElement() 方法。

或者您可以创建一个变量并连接 html 字符串，然后仅附加它：

var html = '<li>';
    html += '<a href="#"><span>link</span></a>';

$('#test_UL').append(html);

jquery .append 自动渲染结束标签

jquery .append automatically renders closing tags

html

jquery

append