javascript - JS求大神指教，怎么删除指定的多个子节点，与在同一个元素下创建多个相同的节点？-PHP中文网问答

javascript - JS求大神指教，怎么删除指定的多个子节点，与在同一个元素下创建多个相同的节点？

怪我咯 2017-04-11 10:52:06

[JavaScript讨论组]

392

怪我咯

走同样的路，发现不同的人生

全部回复(2)

PHP中文网2017-04-11 10:54:06 2楼

https://jsfiddle.net/vzhv2gtt/

因为你的 li 里本来就没有东西，删除所有子节点就好，直接用 innerHTML = "" 就能删除。当然删除子节点的方法还很多，你可以看看

http://www.aichengxu.com/view...
http://blog.csdn.net/wyodyia/...

如果想方便的创建子节点，可以写个函数来解决，比如

function createp(className) {
    var p = document.createElement("p");
    if (className) {
        p.className = className;
    }
    return p;
}

// ....
// 这里调用
parent.appendChild(createp("top_xian"));

如果你只想删除创建的几个 p(尤其是原本LI内不为空的时候)，可以用闭包把创建的 p 先保存下来

https://jsfiddle.net/vzhv2gtt/1/

function setup(parent) {
    var ps = [
        createp("top_xian"),
        createp("bottom_xian"),
        createp("right"),
        createp("nav")
    ];

    parent.onmouseover = function() {
        ps.forEach(function(child) {
            parent.appendChild(child);
        });
    };

    parent.onmouseout = function() {
        ps.forEach(function(child) {
            parent.removeChild(child);
        });
    };
}

for (var i = 0; i < oLi.length; i++) {
    setup(oLi[i]);
}