console 命令行工具 X clear
console
<!DOCTYPE html>
<html>
<head>
    <title>添加和删除li</title>
</head>
<body>
    <ul id="myList">
        <li>Item 1 <button onclick="deleteItem(this)">删除</button></li>
        <li>Item 2 <button onclick="deleteItem(this)">删除</button></li>
        <li>Item 3 <button onclick="deleteItem(this)">删除</button></li>
    </ul>
    
    <button onclick="addItem()">添加新项</button>
    
    <script>
        function deleteItem(button) {
            // 获取要删除的li元素
            var listItem = button.parentNode;
            
            // 获取ul元素
            var myList = document.getElementById("myList");
            
            // 从ul中删除li元素
            myList.removeChild(listItem);
        }

        function addItem() {
            // 创建新的li元素
            var newItem = document.createElement("li");
            newItem.textContent = "New Item " + (document.querySelectorAll("li").length + 1);
            
            // 创建删除按钮
            var deleteButton = document.createElement("button");
            deleteButton.textContent = "删除";
            deleteButton.onclick = function() {
                deleteItem(this);
            };
            
            // 将删除按钮添加到新的li元素中
            newItem.appendChild(deleteButton);
            
            // 获取ul元素
            var myList = document.getElementById("myList");
            
            // 将新的li元素添加到ul中
            myList.appendChild(newItem);
        }
    </script>
</body>
</html>