1

コード内の一連の innerHTML 参照を DOM 準拠のノードのものに置き換えようとしています。

<html>
    <body>hehe</body>
    <script type="text/javascript">
        var myDiv = document.createElement('div');
        myDiv.setAttribute('id', 'myDivID');
        document.getElementsByTagName('body')[0].appendChild(myDiv);
        var textNode = '<p>This will be dynamically generated.</p>';
        myDiv.appendChild(textNode);
    </script>
</html>

確かに、スクリプトは本文の下にあるはずはありませんが、上に配置すると、javascript はエラーを返します。

document.getElementsByTagName("body")[0]未定義です

体がまだ存在していないからです。

しかし、現状では、javascript は「appendChild」ステップでさらに難解なエラーを返します。

uncaught exception:
[Exception... "Could not convert JavaScript argument arg 0 [nsIDOMHTMLDivElement.appendChild]"
nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)"
location: "JS frame :: .....TestStuff/wut.jsp :: <TOP_LEVEL> :: line 8"
data: no]

それで、ここで取引は何ですか？myDiv.setAttributeおよびmyDiv.appendChild行を参照に置き換えることができgetElementById、結果は同じです。

編集: 申し訳ありませんが、上記のエラーは chrome ではなく firefox のものです。クロム エラーは次のとおりです: Uncaught Error: NOT_FOUND_ERR: DOM Exception 8 on the myDiv.appendChild 行。この時点で myDiv が DOM 上にない理由はわかりませんが、クロムはそうではないと考えているようです。

編集2:つまり、この行:

var textNode = '<p>This will be dynamically generated.</p>';

にすれば

var textNode = document.createTextNode('< p>This will be dynamically generated.< /p>');

テキストを正しく出力します。ただし、純粋なテキストではなく実際のマークアップとして出力される html のチャンクを生成して追加する方法を知りたいです。これは、本質的に innerHTML をエミュレートできるものです。

4

2 に答える 2

2 
var textNode = '<p>This will be dynamically generated.</p>';
myDiv.appendChild(textNode);

<p>要素とその中のテキストを別個のノードとして作成する必要があります。これは次のようになります。

var paragraph = document.createElement('p');
var textNode  = document.createTextNode('This will be dynamically generated.');

paragraph.appendChild(textNode);
myDiv    .appendChild(paragraph);

これは、その要素が本当に必要であると仮定しています<p>...</p>。それがなくてもよい場合は、テキスト ノードを作成し、それを に追加しますmyDiv。

于 2010-09-01T23:44:45.847 に答える
1

onloadコードをハンドラーに入れない理由はありますか? すべてではないにしても、ほとんどの問題を解決するように思えます。

現在、ブラウザが XHTML の解析を完了する前に DOM ツリーを変更しようとしています。

于 2010-09-02T01:24:37.270 に答える