🌸 「なでしこ」
>
🍯 「貯蔵庫」
TODOリスト改
🌟新規
📒一覧
🔌
🔍検索
🚪ログイン
TODOリスト改 📖
よりシンプルにTODOリストを作ってみました。DOM操作の好例です。
プログラム:
(→大)
# 初期設定 ファイル名=「todo.json」 TODO = [] # 前回の保存内容を読む ファイル名を開いてTODOに代入。 もし、TODOが未定義ならば、TODO=[] # 画面をHTMLで作成 初期画面=『 <h1>ToDoリスト</h1> <button id="追加ボタン">TODO追加</button> <div id="表示エリア"></div> 』 DOM親要素に初期画面をHTML設定。 「#追加ボタン」をクリックした時には TODO追加処理。 ここまで。 TODO表示。 ●TODO表示とは Sは「」 TODOを反復 ボタンID= 「todo{対象キー}」 S=S&「<li><button id="{ボタンID}">❌</button>」 S=S&「 {対象}</li>」 ここまで。 「#表示エリア」に「<ul>{S}</ul>」をHTML設定。 # ❌ボタンを押した時のイベントを設定 TODOを反復 ボタンID=「#todo{対象キー}」 ボタンIDをクリックした時には 対象@"id"のTODO削除。 ここまで。 ここまで。 ここまで。 ●TODO追加処理とは 「何をするべきですか?」と尋ねる。 もし、それが空ならば戻る。 TODOにそれを配列追加。 TODOをファイル名に保存。 TODO表示。 ここまで。 ●(IDの)TODO削除とは IDの「todo」を「」に置換して整数変換してNOに代入。 TODOのNOを配列切り取る。 TODOをファイル名に保存。 TODO表示。 ここまで。
プログラムを実行
⭐ クジラ飛行机 作
タイトル:
TODOリスト改
ライセンス:
CC0 (著作権破棄)
タイプ:
wnako
タグ:
-
利用バージョン:
3.2.6
作成日時:
2021/04/30 11:30 (編集: 2021/04/30 21:36)
公開の投稿
⭐
ログイン
して★を付けよう!
Twitterへ投稿
📝作品を編集
作品公開情報
📍この作品のURL:
📍アプリ(即時実行)のURL:
📍アプリ(実行ボタンあり)のURL:
📍ブログパーツ:
上記HTML↑をブログに貼り付けることでアプリを埋め込めます。
📍ライブラリ直リンク - 『!「***」を取込』で使うとき:
📍なでしこハブ (最新版の反映は1日後):
ソースの確認
編集履歴の確認
通報数:
0
通報って何?