Javascript 如何克隆具有给定类名的元素

当我需要克隆div元素时，我正在使用

getElementById

代码：

现在我需要使用

getElementsByClassName

使用

getElementsByClassName

时CloneNode不工作。 我怎么能把类名放在这里

谢谢

编辑：

当我尝试使用此选项时：

printHTML( $('.dataTables_scroll').clone(true) );

您可以看到我的功能：

function printHTML(clonedDive){
        var iframe = document.createElement("iframe");
        document.body.appendChild(iframe);
        iframe.contentWindow.onunload = function(){
        $(".DTTT_container").show("fast");
        $("#header_outer").show("fast");
        $(".ColVis.TableTools").show("fast");
        $("#footer").show("fast");
     };
      iframe.contentWindow.document.body.appendChild(clonedDive);
      iframe.contentWindow.print();

      document.body.removeChild(iframe); 
}

我在这行中遇到一个错误：

iframe.contentWindow.document.body.appendChild(clonedDive);

这是一个错误描述：

Uncaught Error: NOT_FOUND_ERR: DOM Exception 8 

这不行吗

printHTML( document.getElementsByClassName("class_name")[0].cloneNode(true));

由于getElementsByClassName返回对象的数组，因此必须使用for循环在它们之间进行迭代，如下所示：

 for (i = 0; i < document.getElementsByClassName("div_name").length; i++){  

printHTML( document.getElementsByClassName("div_name")[i].cloneNode(true));
}

---

getElementsByClassName

获取一个节点列表，或者一个包含元素的类似数组的对象（如果愿意），因为同一个类可以有多个元素

---

getElementsByClassName

即使只有一个元素与类匹配，也会执行此操作。
您通常可以识别

getElements

中的

s

这样的方法，这意味着它可以获取多个元素，即节点列表

getElementById

仅获取一个元素，因为ID是唯一的

要获取节点列表中的第一个元素，请使用括号表示法，如下所示：

document.getElementsByClassName("div_name")[0].cloneNode(true);

或者可以使用

querySelector

，它只获取第一个匹配元素

document.querySelector(".div_name").cloneNode(true);

jQuery解决方案将是：

$('.div_name').clone(true);

要使用某个类名对元素进行迭代，需要使用循环

var elems = document.getElementsByClassName("div_name");

for ( var i=0; i<elems.length; i++ ) {
    printHTML( elems[i].cloneNode(true) );
}

var elems=document.getElementsByClassName（“div_name”）；
对于（var i=0；i您可以循环遍历元素并逐个克隆

var e = document.getElementsByClassName('div');
for (var i = 0; i < e.length; i += 1) {
    // Clone e[i] here
    console.log(e[i].cloneNode(true));
} 

var e=document.getElementsByClassName（'div'）；
对于（变量i=0；i
当您使用getElement时，为什么要将其标记为jQuery…？jQuery解决方案很简单，但不使用这些函数。当您使用并要求我们使用本机DOM方法时，为什么要将其标记为
jQuery
呢？请查看更新的问题，因为您的项目中已经包含了jQuery，我建议您使用jQuery按类名获取元素，因为IE直到版本9才支持本机
GetElementsByCassName
：它现在是一个循环，但实际上不必使用循环！如果只有一个元素，或者当以某个索引的元素为目标时，循环是不必要的。@adeneo使用
getElementsByC是无用的lassName
如果您针对的是单个元素。这可能就是@sєmmsєmme假设
document.getElementsByClassName（“divєu name”）的原因
将返回一个数组。当针对单个元素时，给该元素一个ID并使用
getElementById
@RobinvanBaalen会更快-如果您没有得到它，您可以使用JS针对单个元素，即使页面包含多个具有相同类的元素，那么循环也不会有多大用处。getElementsByClassName always返回一个节点列表，所有带“s”的方法也是如此，如getElementsByTagName等。@adeneo我确实明白了，而且我知道，即使您使用的是以
getElement**s**
开头的方法，也可以以单个元素为目标。但我要说的是速度和最佳实践。如果您以
getElementsByClassName
为目标，Javascript将遍历所有元素这些元素即使您只需要一个。因此，在可能的情况下，最好使用针对单个元素的方法。当然，在某些情况下，这是不适用的。@RobinvanBaalen-同意，当针对单个元素时，ID总是更好，我要说的唯一一点是，您不必使用for循环，而是de挂起，使用循环并不总是必要的，这也不是真正的答案，但上面那行“返回对象的数组”才是真正的问题所在。我仍然在这行中遇到同样的错误：
iframe.appendChild（cloneddave）；
我删除了我的编辑，因为你所做的似乎对我有用->
var elems = document.getElementsByClassName("div_name");

for ( var i=0; i<elems.length; i++ ) {
    printHTML( elems[i].cloneNode(true) );
}

var e = document.getElementsByClassName('div');
for (var i = 0; i < e.length; i += 1) {
    // Clone e[i] here
    console.log(e[i].cloneNode(true));
}