时间戳

首页 > 解决方案 > 将表格和行添加为 html 元素时，jQuery 会关闭内容

javascript - 将表格和行添加为 html 元素时，jQuery 会关闭内容

问题描述

所以我有以下代码：

htmlElement = $('<' + chosenTag + '>' + insideHTML + '</' + chosenTag + '>');
$('#container').append(htmlElement);

如果htmlElement和chosenTag都等于div，则在执行此代码后，将div在容器中创建一个元素。其他标签也是如此：h1-h6, ul, span, ol, li, etc...

但由于某种原因，如果标签是table或tr代码不能正常工作。如果htmlElement和chosenTag都等于table（或tr），则alert(htmlElement.html());返回undefined。

当这个元素被附加到容器时，它是在没有insideHTML（html，即标签之间）的情况下创建的，但insideHTML由于某种原因，它被放置在这个新元素之前。所以它就像：

<div id="container">
    table
    <table></table>
</div>

为什么会发生这种情况以及如何解决？

标签： javascriptjqueryhtml

解决方案

从以下文档jQuery( html [, ownerDocument ] )：

如果 HTML 比没有属性的单个标记更复杂，...，元素的实际创建由浏览器的.innerHTML机制处理。在大多数情况下，jQuery 会创建一个新<div>元素并将innerHTML该元素的属性设置为传入的 HTML 片段
。...
为了确保跨平台兼容性，片段必须格式正确。

您正在尝试将无效的内容放入<table>and中。<tr>A<table>不能包含文本节点作为直接子节点，它必须包含在 a<tr>和<td>/<th>中。

推荐阅读