JavaScript最后一个子问题

当我在现有段落前后的文本字段中添加文本时，“删除”按钮功能完美。但是，如果在添加元素之前单击“删除”按钮，则必须单击两次才能删除不是由函数创建的段落

这里可能出了什么问题？我在Firebug中观察DOM的添加和删除，在添加新元素之前，我的删除按钮在第一次单击时不会以“firstDiv”为目标，而是在第二次单击时以“firstDiv”为目标

以下是问题函数：

function removeIt() {
    firstDiv.removeChild(firstDiv.lastChild);
}

这是小提琴：

---

谢谢你的帮助

这是因为末尾有文本节点（空格），所以最后一段不是最后一个子元素（它是最后一个子元素）

然后，使用

function removeIt() {
    firstDiv.removeChild(firstDiv.lastElementChild);
}

演示：

兼容性：要使其在旧浏览器上工作，还可以使用

function removeIt() {
    if (firstDiv.lastElementChild) {
        firstDiv.removeChild(firstDiv.lastElementChild);
    } else {
        var last; 
        while((last = firstDiv.lastChild).nodeType !== 1) {
            firstDiv.removeChild(last);
        }
        firstDiv.removeChild(last);
    }
}

参考资料

使用：

 firstDiv.removeChild(firstDiv.lastElementChild);

由于html中存在格式化新行字符，因此该字符也将被视为div的子元素。因此，您需要使用

lastElementChild

获取元素并忽略格式化和外部的其他文本节点

返回的最后一个子节点是节点。如果其父节点是元素，则子节点通常是元素节点、文本节点或注释节点。如果没有子元素，则返回null

---

哇，这非常有效，为我解开了一个谜-谢谢！