使用Javascript中的document.innerHTML自我關閉標記問題

Question

我正在為一個網站編寫一個用於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>標記也消失了。 我用Google搜索了幾乎所有的互聯網，但我讀過的解決方案都沒有解決我的問題。

Answer 1

獲得.innerHTML時，關閉</form>標簽會在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為<table>提供了這個innerHTML ：

<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/

Answer 2

好吧，看看你的代碼，你需要在中間創建一個帶有未封閉TD的表單。

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

試試這種方式。