gpt4 book ai didi

javascript - insertBefore 在空 ul 中

转载 作者:行者123 更新时间:2023-12-03 00:03:00 25 4
gpt4 key购买 nike

我有一个漂亮、有效且实用的待办事项 list 。然而,在实践中(在手机上使用它),添加到列表中的新项目会被键盘隐藏。因此,我想让列表将每个项目添加到列表的开头或顶部,以便在创建新项目时看到它们。

输入“insertBefore()”,只要之前有子项插入,它就可以正常工作,否则会抛出错误。

您如何使用空列表来完成这项工作?只需执行“如果没有子元素,则执行此操作 - 否则 - 执行此操作”,或者是否有一个简单的添加到该过程?

var inputText = document.getElementById("textField");
var myUl = document.getElementsByTagName("ul");

inputText.addEventListener("keypress", function(event){
if( event.keyCode === 13){
var myInputText = this.value;
var listItem = document.createElement("li");
var spanItem = document.createElement("span");
var theText = document.createTextNode(myInputText);
var span_img = document.createElement("img");
span_img.src = "images/trashCanBlack.png";
spanItem.appendChild(span_img);
listItem.appendChild(spanItem);
listItem.appendChild(theText);

myUl[0].appendChild(listItem); // this works, but only adds it on the end
this.value = "";
}
});

最佳答案

So I want to have the list add every item to the beginning, or top of the list...

不管你信不信,就是这么简单:

myUl[0].insertBefore(listItem, myUl[0].firstChild);

如果 myUl[0] 为空(因此它的 firstChildnull)就可以了。 insertBefore 足够聪明,可以处理这个问题(通过有效地成为 appendChild)。

<小时/>

旁注:而不是做:

var myUl = document.getElementsByTagName("ul");

...然后在任何地方使用 myUl[0] ,您可以考虑:

var myUl = document.querySelector("ul"); // returns the first one

var myUl = document.getElementsByTagName("ul")[0];

...然后只需使用 myUl

关于javascript - insertBefore 在空 ul 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55091370/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com