在附加之前，如何檢查最后一個動態創建的li元素是否填充在ul中

Question

我正在動態創建一個列表，li元素里面有輸入類型文本。 如何檢查最后創建的li元素是否為空。因為我不希望用戶不必要地創建li元素。目前我將警報輸出作為[object HTMLLIElement]。我想要輸入文本。 先感謝您。

                     function add_down(){

                       var node = document.createElement("LI");
                       var element = document.createElement("input");
                       element.type = 'text';
                       element.placeholder = "Enter name";
                       node.append(element);
                       var x = document.getElementById("start").lastChild;
                       alert(x);
                       document.getElementById("start").appendChild(node);

}

Answer 1

要獲取ul最后一個li內部文本，您可以執行以下操作：

HTML：

<ul id="list">
  <li><input type="text" /></li>
  <li><input type="input" /></li>
</ul>

點擊我

JavaScript的：

let list = document.getElementById("list")
let button = document.getElementById("click")

 button.addEventListener("click",function(){
 console.log(list.childNodes[list.childNodes.length-2].childNodes[0].value)
})

這是一支檢查代碼的筆https://codepen.io/khanChacha/pen/byabQe?editors=1011