質問: "○"; } //------------------------------------------------------------ ``` ### 試したこと デバッグしてみたところ、メソッドonClickedの仮引数(e)に何も引数が渡されてないのかもしれないと思いました。 onclickというイベントが実行された際に、仕組みとして自動(?)でeventオブジェクトという実引数が、onclickプロパティにセットされたメソッドの仮引数に渡される認識だったのですが、この認識は間違っていますか? どのようなコードにすれば改善されるか、教えて頂けると幸いです。 よろしくお願いいたします。 ### 補足情報(FW/ツールのバージョンなど) Google Chrome
回答: > > メソッドonClickedの仮引数(e)に何も引数が渡されてないのかもしれない > > > 違います。 e.target はクリックされた要素が渡されています。 エラーの原因は `id` を取得し、変数 `clickedCellId` に格納しているのに、文字列 `"clickedCellId"`(存在しない id の要素)を `getElementById()` したため、null が返却され、ご質問で示したエラーメッセージとなっています。 ``` function onClicked(e) { console.log( e.target ); // 要素が渡されていることを確認できる。 var clickedCellId = e.target.id; console.log( clickedCellId ); // id を確認できる document.getElementById(clickedCellId).textContent = "○"; } ``` ご質問のコードでは、全ての td 要素にイベントリスナを適用しているので、以下のようにできます。 ``` function onClicked(e) { e.target.textContent = "○"; } ``` 動くサンプル では、クリックする度に ○と×が切り替わる内容にしてみました。