Question

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

代码：

printHTML( document.getElementById("div_name").cloneNode(true));

现在我需要使用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

Answer 1

getElementsByClassName获取一个nodelist，或者一个包含元素的类数组对象，因为可以有多个具有相同类的元素。

即使只有一个元素与该类匹配，

getElementsByClassName也会这样做您通常可以识别s中的getElements等方法，这意味着它会获得多个元素，即nodeList。

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) );
}

Answer 2

由于 getElementsByClassName 返回一个对象的数组，所以你必须使用for循环来迭代它们，如下所示：

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

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

否则，如果您知道元素的索引，我们就说1

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

Answer 3

这不起作用？：

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

Answer 4

你可以循环遍历元素并逐个克隆......

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

如何使用给定的类名克隆元素

4 个答案: