jquery append（）忽略<span>标记</span>

Question

我遇到了jquery append()的奇怪行为。

考虑这两个类似的HTML字符串，两者都是有效的标记。

var ids='Hello, <i>world</i>!<br/>';
var sds='Hello, <span>world</span>!<br/>';

附加到DOM元素

$('#debug').append(ids);
$('#debug').append(sds); 

<span>标记已删除！结果是

  

你好，世界！
  你好， ！

在检查我的DOM时，我在html中看不到<span>

这可能是什么原因被删除？

---

最终编辑

我发现了问题。它碰巧是一段完全不相关的代码中的错误。简而言之，这就是原因。

我有这个

 $("span").foo().bar().appendTo($id);

而不是

 $("<span>").foo().bar().appendTo($id);

因此，它删除了所有<span>标记。

Answer 1

查看以下小提琴的不同之处：

<强> HTML：

<div id="debug"></div>

<强> JS：

var ids = 'Hello, <i>world</i>!<br/>';
var sds = 'Hello, <span>world</span>!<br/>';

$('#debug').append(ids);
$('#debug').append(sds);

<强> CSS：

span {
    display: none;
}

span tag without CSS

span tag with CSS

因此，这些小提琴确保您的CSS必须有问题。 jQuery append方法没有问题。