もう投げたい

ふつうにHTMLに

<table>
  <tr>
    <form><td>hello</td></form>
  </tr>
</table>

こう書いてると

<table>
 <tbody>
  <tr>
    <form />
    <td>hello</td>
  </tr>
 </tbody>
</table>

こうなる。tdがformの子要素に入らなくてtrの子要素になるわけです。
googleの検索結果のページがこうなってる。

なかなかすすまない - ゼロメムはてな支店のconvertToHTMLDocumentで

var doc = convertToHTMLDocument("<table><tr><form><td>hello</td></form></tr></table>");
console.log([doc, doc.firstChild.innerHTML]);

こうするとそのままformの子要素としてtdが入って

<table>
 <tbody>
  <tr>
    <form>
      <td>hello</td>
    </form>
  </tr>
 </tbody>
</table>

になる。

どうしたら同じになりますか。
ブラウザがレンダリングするときとまったくおなじに評価してほしいのにー。いっそのことiframe?

こんな古代のバッドノウハウ入れないでほしい。