JavaScriptでのHTMLテーブルセルの変更
あるHTMLテーブル #table が与えられているとします。
例えば、各セルにテキスト '!' を書き込むなど、
テーブルの各セルに対して何かを行うという課題があるとします。
このような課題を解決する際のニュアンスについて議論しましょう。
ご存知のように、HTMLテーブルは二次元構造を持っています： 行があり、その中にセルがあります。私たちの課題は次のように解決できます： 行をループで回し、各行の中でセルをループで回して、必要なアクションを実行します。 つまり、提示された解決スキームは、 そのようなテーブルを行とセルで埋めながら作成する方法と似ています。
しかし、この場合、二重のネストされたループは不要です：
すべての td を取得し、それらをループで回して必要な操作を実行すればよいのです。
それを行いましょう：
let tds = document.querySelectorAll('#table td');
for (let td of tds) {
td.textContent = '!';
}
数字を含むHTMLテーブルとボタンがあるとします。 ボタンをクリックすると、テーブルの各セルの数字を2倍に増やしてください。
