前提・実現したいこと
JavaScript でテキストとチェックボックスを動的に作成し、1行にリスト表示したい。
※li要素として1行にテキストとチェックボックスを表示。
問題
チェックボックスで1行、テキストで1行として表示されてしまう。
appendChild()
の引数で1行ずつ実行しているせいだとはわかるのですが、では引数として何を作成してappendChild()
すればよいのかわかりません。
該当のソースコード
JavaScript
1function click1() { 2 var input_message = document.getElementById("todoThings").value; 3 var li = document.createElement('li'); 4 var checkBox = document.createElement('input'); 5 checkBox.setAttribute('type','checkbox'); 6 li.textContent = input_message; 7 8 9 document.getElementById('contentsList').appendChild(checkBox); 10 document.getElementById('contentsList').appendChild(li); 11} 12
HTML
1<form> 2 <input type="text" id="todoThings" name="todoThings"> 3 <input type="button" onClick="click1()" name="addButon" value="Add"> 4</form> 5 6<div> 7 <ul id="contentsList"> 8 9 </ul> 10</div>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。