javascript - Javascript 中 document.innerHTML 的自闭标签问题

Question

我正在为一个网站用 Javascript 为 Firefox(Greasemonkey)、Opera 和 Chrome 编写浏览器插件。问题是，当我加载 document.innerHTML变成一个变量，

<form name="foo" action="foo.php" method="get">
<td id="td">text:
<input name="k" type="text" />
&nbsp;</td>
</form>

...将上面的网站(我正在为其编写插件)的原始代码转换为

<form name="foo" action="foo.php" method="get">
<td id="td">text:
**<input name="k" type="text">**
&nbsp;</td>

...这个。如您所见，自动关闭 <input />标签不再关闭，</form>标签也消失了。我用谷歌搜索了几乎所有互联网，但我阅读的所有解决方案都没有解决我的问题。

Answer 1

关闭</form>获取 .innerHTML 时，在 Firefox 中为我显示标签.

我建议丢失的标签是由于您的标记造成的，我很确定它是无效的:

  <!-- A <form> wrapping a <td> ? -->
<form name="foo" action="foo.php" method="get">
    <td id="td">text:
        <input name="k" type="text" />
        &nbsp;
    </td>
</form>

<td> 的父级元素应该是 <tr> , 不是 <form> .

鉴于此标记:

<table>
    <tr>
        <form name="foo" action="foo.php" method="get">
            <td id="td">text:
                <input name="k" type="text" />
                &nbsp;
            </td>
        </form>
    </tr>
</table>

...Firefox 给我这个 innerHTML对于 <table> :

<tbody>
    <tr>
        <form name="foo" action="foo.php" method="get"></form>
            <td id="td">text:
                <input name="k" type="text">
                &nbsp;
            </td>

    </tr>
</tbody>

它尝试更正无效标记。

演示: http://jsfiddle.net/grM4c/