File tree Expand file tree Collapse file tree 1 file changed +5
-4
lines changed
docs/2-browser-apps/06-project Expand file tree Collapse file tree 1 file changed +5
-4
lines changed Original file line number Diff line number Diff line change @@ -60,7 +60,7 @@ addButton.onclick = () => {
6060```
6161
6262この時箇条書きの項目として新たに ` li ` 要素を追加する必要があります。
63- [ ` document.createElement ` 関数] ( https://developer.mozilla.org/ja/docs/Web/API/Document/createElement ) を使うと新しい要素を作成できます。
63+ DOM の章で扱ったように、 [ ` document.createElement ` 関数] ( https://developer.mozilla.org/ja/docs/Web/API/Document/createElement ) を使うと新しい要素を作成できます。
6464また、[ ` Node#appendChild ` メソッド] ( https://developer.mozilla.org/ja/docs/Web/API/Node/appendChild ) を用いることで既存の要素内に子要素を追加することができます。
6565
6666``` javascript
@@ -71,8 +71,9 @@ todoList.appendChild(li);
7171また、` HTMLInputElement#value ` プロパティから、DOM に対応する input 要素の入力欄への入力内容を取得できます。
7272
7373``` js
74- const inputValue = todoInput .value ; // todoInput の value を取得する
75- todoInput .value = " " ; // todoInput の入力欄を空にする
74+ const todoText = document .createElement (" span" );
75+ todoText .textContent = todoInput .value ; // input 要素に入力された文字列を取得する
76+ todoInput .value = " " ; // input 要素の入力欄を空にする
7677```
7778
7879<Details summary = ' ステップ 1 の解答例' >
@@ -281,7 +282,7 @@ addButton.onclick = () => {
281282 editButton .textContent = " 編集" ;
282283 editButton .onclick = () => {
283284 const input = prompt (" 編集内容を入力してください" );
284- // prompt で入力された文字列が空の場合は空文字列 ("")、キャンセルされた場合は null を返す
285+ // prompt 関数は入力された文字列が空の場合は空文字列 ("")、キャンセルされた場合は null を返す
285286 if (input !== " " && input !== null ) todoText .textContent = input;
286287 };
287288 deleteButton .textContent = " 削除" ;
You can’t perform that action at this time.
0 commit comments