text()について
text()は指定した要素のテキストノードを返す。
指定した要素に含まれる子孫要素のテキストノードすべてを結合して返す。
※ テキストノードは、「HTML 文書」や「XML 文書」の、タグ以外の文字データ
今回使用するhtmlの例
html
<div class="hoge">
<div class="hoge1">hoge1です</div>
<ul>
<li>hogeの中の1個目</li>
<li>hogeの中の2個目</li>
</ul>
</div
このhtmlに対して
$('.hoge').text();
を実行すると、次のような結果になる。
結果
hoge1です hoge1の中の1個目 hoge1の中の2個目
html()
html()は指定した要素のHTMLを返す（指定した要素は含まない）
今回使用するhtmlの例
html
<div class="hoge">
<div class="hoge1">hoge1です</div>
<ul>
<li>hogeの中の1個目</li>
<li>hogeの中の2個目</li>
</ul>
</div
このhtmlに対して
$('.hoge').html();
を実行すると、次のような結果になる。
結果
<div class="hoge1">hoge1です</div>
<ul>
<li>hogeの中の1個目</li>
<li>hogeの中の2個目</li>
</ul>
その他
html()やtext()で書き換えた文が存在するかどうかの確認。
自分がやった方法なので、他に方法にも方法はある。
console.log($('.hoge').text());
console.log($('.hoge').html());
この記事は以下の情報を参考にして執筆しました。