克隆DIV＆amp;修改身份证

Question

我需要克隆一个样式化的DIV（id="#mirrorBG1"）并将新的div ID修改为id="#mirrorBG2"，然后在CSS中应用类#mirrorBG2来控制新的div 1}}位置＆amp;大小等。

请提出任何想法！

<div id="mirrorBG1">IMAGE#1 (*main image*) </div>

resulting in adding: <div id="mirrorBG2">IMAGE#1 (*same image*) </div>

#mirrorBG1 { width:50%; height:300px; background-color:#0F0"; float:left; clear:both; }
#mirrorBG2 { width:50%; height:300px; background-color:#FF0"; float:right; clear:both; }

Answer 1

更新版本：

var div2 = document.getElementById("mirrorBG1").cloneNode(true);
div2.setAttribute("id","mirrorBG2");
div2.className = "mirrorBG2";

之后，您可以将div添加到任何您想要的位置。 例如：

document.body.insertBefore(div2, null);

请参阅jsfiddle

编辑：

正如stavarotti所指出的那样，10之前的IE版本并不完全支持classList。

所以代替：

div2.classList.remove("mirrorBG1");
div2.classList.add("mirrorBG2");

您可以这样做：

div2.className = "mirrorBG2";

这将用“mirrorBG2”替换“mirrorBG1”类。

我更新了jsfiddle以显示这些更改。

Answer 2

如果对您没有太多依赖，请考虑使用jQuery及其clone()和append()方法。有关详细信息，请参阅the jQuery API。