[解決済み] クラスとIDで要素の中の要素を取得する - JavaScript

質問

さて、私は以前JavaScriptに手を出したことがありますが、最も有用なのはCSSスタイルスイッチャーを書いたことです。だから、私はこのことについて多少新しいです。例えば、こんなHTMLコードがあったとしよう。

<div id="foo">
    <div class="bar">
        Hello world!
    </div>
</div>

をどのように変更すればよいのでしょうか？ Hello world! を Goodbye world! ?

私はどのように知っている document.getElementsByClassName と document.getElementById が動作するのですが、もっと具体的に知りたいのです。以前にも質問されていたらすみません。

どのように解決するのですか？

さて、まず要素を選択するには、以下のような関数が必要です。 getElementById .

var targetDiv = document.getElementById("foo").getElementsByClassName("bar")[0];

getElementById は1つのノードを返すだけですが getElementsByClassName はノードリストを返します。 そのクラス名を持つ要素は（私が知る限り）ひとつしかないので、最初のものを取得すればいいのです（それが [0] は、ちょうど配列のようなものです）。

そして、htmlを .textContent .

targetDiv.textContent = "Goodbye world!";

var targetDiv = document.getElementById("foo").getElementsByClassName("bar")[0];
targetDiv.textContent = "Goodbye world!";

<div id="foo">
    <div class="bar">
        Hello world!
    </div>
</div>