使用javascript克隆div的孩子

时间:2017-09-29 09:19:52

标签: javascript jquery html clone

我多次克隆div,我也需要更改其内部子div。 (例如id_j1,id_j2等)

我设法克隆整个div并更改其id而不是孩子的ID。

的javascript

document.getElementById('btn_new_service').onclick = duplicate;
var i =0;
function duplicate() {
    var original = document.getElementById('duplicator');
    var clone = original.cloneNode(true); // "deep" clone
    clone.id = "duplicator" + ++i; // there can only be one element with an ID} 
original.parentNode.appendChild(clone);

如果我在上面的代码中附加下面的代码,那么我会收到Uncaught TypeError: clone.children is not a function的错误。

var new_div_ID = 'duplicator-' + i;
var new_service_ID = 'c_service-'+i;
var new_vat_ID = 'vat-'+i;
var new_amount_ID = 'amount-'+i;
var new_vatamount_ID = 'vat_amount-'+i;
clone.children('#c_service').attr('id',new_service_ID);
clone.children('#vat').attr('id',new_vat_ID);
clone.children('#amount').attr('id',new_amount_ID);
clone.children('#vat_amount').attr('id',new_vatamount_ID);

我从两个不同的代码片段中获取了它们,但是当我将它们组合起来时,它们却没有。任何提示为什么会这样?

1 个答案:

答案 0 :(得分:2)

  

如果我在上面的代码中附加下面的代码,那么我得到一个错误   未捕获的TypeError:clone.children不是函数。

children在vanila js中不是function,而是使用querySelector而使用setAttribute

成功

clone.querySelector('#c_service').setAttribute('id',new_service_ID);