JavaScriptでのテキスト要素の操作
DOM要素には、それらの要素のテキストを読み取ることを可能にするtextContentというプロパティがあります。
例を見てみましょう。以下のようなタグがあるとします:
<p id="elem">text</p>
このタグへの参照を変数に取得します:
let elem = document.querySelector('#elem');
タグのテキストを読み取ります:
console.log(elem.textContent);
タグのテキストを変更します:
elem.textContent = '!!!';
段落とボタンが与えられています。ボタンがクリックされたとき、段落のテキストを読み取り、コンソールに出力してください。
段落とボタンが与えられています。ボタンがクリックされたとき、段落に新しいテキストを書き込んでください。
それぞれのテキストとして何らかの数値を持つ2つの段落と、ボタンが与えられています。ボタンが押されたとき、保持している数値の合計を画面に出力してください。
数値を持つ3つの段落、div要素、ボタンが与えられています。ボタンが押されたとき、div要素のテキストに数値の合計を書き込んでください。
数値を持つ段落とボタンが与えられています。ボタンが押されたとき、段落の値に1を加え、得られた数値を再び書き込んでください。
テキストを持つ段落とボタンが与えられています。ボタンが押されたとき、段落のテキストの末尾に感嘆符を追加してください。