0

私が取り組んでいるプロジェクトでは、JavaScriptを使用してDOM要素を操作する必要があります。特定のイベントが発生すると、DOMをループし、後で操作するために基本的にすべてのノードのインデックスを作成します。私がこのインデックスを作成する理由は他にもありますが、簡単にするために、ここでそれを呟きます。

ただし、問題は、DOM内の要素を操作しようとすると、DOM内の実際のオブジェクトとは別のオブジェクトを操作しているように見えることです。これが私が思いつくことができるのと同じくらい基本的な例です：

<div id="container">
    <div>Here is some text</div>
    <div>And here is some more text</div>
</div>

<script>
    var container = document.getElementById('container');
    container.firstChild.innerHTML = 'Foobar';
</script>

フィドル： http： //jsfiddle.net/4Nngh/

ただし、最初のdivが「Foobar」に変更されることはありません。「container」要素を取得すると、DOM要素への参照ではなく、実際には別のオブジェクトを取得していると思います。

DOMに表示されている要素を単純に参照して直接操作することは可能ですか、それとも何らかの置換方法を使用する必要がありますか？他のイベントは、スクリプトの実行中にそのDOM要素の内容を変更する可能性があるため、イベントが発生するたびにこのインデックスを再作成する必要がないようにしています。そのため、どういうわけか要素。

ありがとう！

4

1 に答える 1

4

これfirstChildは、実際には改行とタブの組み合わせを含むテキストノードです。

最初の要素の子を取得するには、を使用しますchildren[0]。children[]配列には要素ノードのみが含まれます。

于 2013-01-25T20:38:51.150 に答える