dポイントプレゼントキャンペーン実施中!

(-----)以下のHTMLから階層関係を用いて要素を取得してみました。
(1)
const target = document.getElementById('second');
const parent = target.parentNode;
console.log(parent);

と記述しました。
この場合返ってくるのは、
<ul id="parent">...</ul>
となります。これはなんとなくわかります。

(2)

const base = document.getElementById('parent');
const children = base.children;

console.log(children[0]);
console.log(children[1]);
console.log(children[2]);

次に上記のように記述しました。この場合も同じように添付画像のようなタグが返ってきます。
タグがそのまま返ってきます。

●1番目
●2番目
●3番目

のように返ってくるにはどのような記述をしたらよいですか?
よろしくお願いします。



----------------------------
(HTML)
<ul id="parent">
<li id="first">1番目</li>
<li id="second">2番目</li>
<li id="third">3番目</li>
</ul>

「【JavaScript】階層関係から要素」の質問画像

A 回答 (1件)

親から子のテキストをとりたいならこう



const p=document.querySelector('#parent');
const c=[...p.querySelectorAll('li')].map(x=>x.textContent);
console.log(c);
    • good
    • 0
この回答へのお礼

textContentを使えば良いのですね。
どうもありがとうございました。

お礼日時:2020/10/02 13:45

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!