JavaScript: textContent の使い方
textContent プロパティは、
ノードおよびその子孫の
通常、テキスト情報を取得・設定する場合は textContent プロパティ、 HTMLコードを取得・設定する場合は innerHTML プロパティを使用します。
使い方
// 取得
var text = elem.textContent;
// 設定
elem.textContent = text
サンプルコード
次のコードは、id="hoge" のdiv 要素の textContent を取得して表示します。
<div id='hoge'><b>Java<br>Script</b></div>
<script>
var elem = document.getElementById('hoge');
console.log(elem.textContent); // JavaScript
console.log(elem.innerHTML); // <b>Java<br>Script</b>
</script>
div 要素内には、'JavaScript' というテキストと、 太字を意味する b タグ、改行を意味する br タグがあります。
textContent プロパティは、テキスト情報を表しますから、 div 要素内にある b タグや br タグは表示されず、 「JavaScript」というテキスト情報のみが表示されます。
タグを含めて取得したい場合は、innerHTML を使用します。
IE9 以前では innerText を使う
textContent プロパティは、IE9 以前では使用できません。 textContent プロパティの代わりに、innerText プロパティを使用します。
次のコードは、テキスト情報をtextContent で取得できない場合、 innerText で取得するロジックです。
var text = elem.textContent;
if (text == undefined) text = elem.innerText;