javascript - 如何克隆图像但删除最后一个子图像？

Question

我想将左侧 div 的图像克隆到右侧 div。但我确实必须删除 leftSide div 元素的最后一个子元素。页面加载时，我的左侧 div 应有 5 个面，右侧 div 应有 4 个图像。我怎样才能达到这个结果？如果我尝试从右侧 div 中删除最后一个Child，则面会从 div 中消失。我想用 javascrip 来做到这一点。

这是我的代码:

    function generateFaces(){
        var theLeftSide = document.getElementById("leftSide");  
        var width = 500, height = 500;
        var top_position = 0, left_position = 0,
        numberOfFaces = 5;
            for (var i = 0; i < 5; i++) {
            createElement(i);   
            numberOfFaces += 5;
        }
        var theRightSide = document.getElementById("rightSide");
        leftSideImages = theLeftSide.cloneNode(true);
        document.getElementById("rightSide").appendChild(leftSideImages);
        theRightSide.removeChild(theRightSide.lastChild);
        function createElement() {
            var image = document.createElement('img');
            image.src = "smile.png";
            image.style.position = 'absolute';
            image.style.top = top_position + "px";
            image.style.left = left_position + "px";
            theLeftSide.appendChild(image);
            top_position = Math.random() *   400 ;
            left_position = Math.random() *  400 ;  
        }
    };

Answer 1

删除 leftSideImages 的最后一个子元素，即图像所在的位置。theRightSide 最后一个子元素是 leftSideImages，其中包含所有图像。

leftSideImages.removeChild(leftSideImages.lastChild);