Last active
November 1, 2019 07:27
-
-
Save itochan/1cba51780eb4dfc73758fa81566a1ae9 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>ToDoリスト</title> | |
| <script src="todo.js"></script> | |
| </head> | |
| <body> | |
| <h1>ToDo</h1> | |
| <p> | |
| <input type="text" id="taskName" placeholder="タスク"> | |
| <input type="button" value="追加" onclick="addTask();"><br> | |
| <input type="button" value="最初を削除" onclick="removeFirstTask();"> | |
| <input type="button" value="最後を削除" onclick="removeLastTask();"> | |
| </p> | |
| <ul id="taskList"></ul> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var tasks = []; | |
| // タスクを追加 | |
| function addTask() { | |
| var taskName = document.getElementById("taskName").value; | |
| tasks.push(taskName); | |
| updateTasks(); | |
| } | |
| // 最初のタスクを削除 | |
| function removeFirstTask() { | |
| tasks.shift(); | |
| updateTasks(); | |
| } | |
| // 最後のタスクを削除 | |
| function removeLastTask() { | |
| tasks.pop(); | |
| updateTasks(); | |
| } | |
| // 配列の中身を見てタスクリストを更新 | |
| function updateTasks() { | |
| document.getElementById("taskList").innerHTML = ""; | |
| for (var i = 0; i < tasks.length; i++) { | |
| document.getElementById("taskList").innerHTML += "<li>" + tasks[i] + "</li>"; | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment