如何使用Javascript正确克隆DOM结构中的分支并删除最后一个节点

时间:2017-03-12 18:02:19

标签: javascript html dom clone

我有两个div,一个用于左侧,一个用于右侧。 在左边一个我附加了5个不同的图像。我需要将它们克隆到右边的那个,将它们附加到右边的一个并删除最后一个节点。

左侧:

var LS = document.getElementById("left");

var number = 5;
while(number > 0)
{
    var theImage = document.createElement("img");
    LS.appendChild(theImage);
    number--;
}

对于右侧:

var RS = document.getElementById("right");
var leftImages = LS.cloneNode(true);

RS.appendChild(leftImages);

while(RS.lastChild!=null)
{
    var noviCh = RS.lastChild;
}
RS.removeChild(noviCh);

代码不起作用。任何人都知道为什么?

2 个答案:

答案 0 :(得分:0)

不是添加所有图像然后删除一个图像,而是首先不添加最后一个图像?

var LS = document.getElementById("left");

for (var i = 0; i < 5; i += 1) {
  var theImage = document.createElement("img");
  LS.appendChild(theImage);
}

var RS = document.getElementById("right");
var imgs = LS.getElementsByTagName('img');

for (var i = 0; i < imgs.length - 1; i += 1) {
  RS.appendChild(imgs[i].cloneNode(true));
}
#left {
  background-color: yellow;
}

#right {
  background-color: green;
}

img {
  width: 100px;
  height: 100px;
  background-color: red;
}
<div id="left"></div>
<div id="right"></div>

答案 1 :(得分:0)

errorDescription

enum RegistrationErrors: LocalizedError {
    case invalidFirstName
    case invalidLastName
    case invalidCountry
    var errorDescription : String? {
        switch self {
        case .invalidFirstName: return NSLocalizedString(
            "First name cannot be empty", comment:"First name cannot be empty")
        case .invalidLastName: return NSLocalizedString(
            "Last name cannot be empty", comment:"Last name cannot be empty")
        case .invalidCountry: return NSLocalizedString(
            "Country cannot be empty", comment:"Country cannot be empty")
        }
    }
}