javascript - 要素内のタグ名でテキストを選択するには?

Question

divでラップされているタイトルを選択する必要があるh2ので、これがh2である現在のdivである場合、このようなことを行いthis.getElementsByTagName('h2')ます-現在のh2要素を返しますが、取得しようとするとinnerHTMLnullinnerTextを返します。私は何を間違っていますか？

Answer 1

現在の h2 要素を返しますが、innerHTML または innerText を取得しようとすると null が返されます。私は何を間違っていますか？

getElementsByTagNameNodeList要素ではなく を返します。リストには がありませんがinnerHTML、その各要素にはあります。例:

var list = this.getElementsByTagName('h2');
if (list[0]) {
    title = list[0].innerHTML;
}

または、それが存在することが確実な場合：

title = this.getElementsByTagName('h2')[0].innerHTML;

...しかし、h2 が見つからない場合は例外がスローされます。

Answer 2

いいえ、this.getElementsByTagName('h2')タグ name を持つ要素の配列を返しますh2。

配列を反復して、必要な正しい要素にアクセスする必要があります。

Answer 3

2つのこと：

1. によって返されるノード リストの最初の要素をキャプチャする必要がありますgetElementsByTagName()。

   var h2 = this.getElementsByTagName('h2')[0];
   

2. タグの内容を取得するために使用するプロパティは、ブラウザごとに異なります。

   var title = h2.textContent || h2.innerText || null;
   

Answer 4

はい、あなたは小さな間違いを犯しました。this.getElementByTagName('h2')は、(タグの) リストを返すためです。

あなたのタグであることは、最初の要素です[0]

あなたが使用することができます

var v= this.getElementsByTagName('h2');
var yourdata=v[0].innerHTML;

Answer 5

他の回答が示すように、 getElementsByTagName は配列を返します。

別のオプションは、 querySelector を使用することです (最新のブラウザーでのみサポートされているため、最初にサポートする必要があるものを確認してください)

このページで querySelector を実行すると、次のようになります。

window.document.querySelector('h1').innerHTML //#>
"<a href="/questions/16516643/how-to-select-text-by-tag-name-in-element" class="question-hyperlink">How to select text by tag name in element?</a>"

クエリセレクター

querySelectorAll