挿入前にli要素、閉じるボタンno show

Question

私はTODOリストを作成していますが、前の項目を追加したいのですが... コードは機能していますが、何らかの理由で閉じるボタンが来ていません... 私はちょうど "のappendChild"

//リスト項目を追加

var list = document.createElement("li"); 
var textNode = document.createTextNode(textInput); 
list.appendChild(textNode); 
if (textNode == ' ') { 
    alert("Nothing to add!"); 
} else { 
    var uList = document.getElementById("my-todo-list").appendChild(list); 
    // var uList = document.getElementById("my-todo-list"); 
    // uList.insertBefore(list, uList.childNodes[0]); 
} 

//閉じるボタン

var listItems = document.getElementsByTagName('li'); 
for (var i = 0; i < listItems.length; i++) { 
    var spanItem = document.createElement('span'); 
    spanItem.style.float = 'right'; 
    var myCloseSymbol = document.createTextNode('\u00D7'); 
    spanItem.classList.add("closeBtn"); 
    spanItem.appendChild(myCloseSymbol); 
    listItems[i].appendChild(spanItem); 
} 

持つアイテムを追加する場合、それが来ています

https://jsfiddle.net/headbangz/8yzdL312/

Answer 1

私はあなたのコード上の問題を発見しました。問題は以下のコードにあります。

listItems[i].appendChild(spanItem); 

あなたの概念を1としては、まず、新しいli要素を追加したが、最後li要素に閉じるボタンを追加しています。このステートメントは以下のように変更する必要があります。

listItems[0].appendChild(spanItem); 

あなたのinsertBefore行にコメントして、上記と同じことを確認しました。あなたはこの更新されたFiddleでそれをチェックアウトすることができます。