我收到以下错误“无法在'节点'上执行'insertBefore'”

时间:2019-10-03 21:07:42

标签: javascript html forms

我正在尝试创建一个程序,该程序根据用户在字段上输入的数字来克隆表格 由于我不熟悉javascript,因此我一开始尝试使其与

兼容,而我能够做到这一点。

但是令我惊讶的是,当我在另一个表单中添加了一个嵌套表单(form2)时,我的代码就停止了= /。

我已经尝试过在表单中​​添加不同的元素(DIV,列表等),并且所有元素似乎都可以正常工作。

我没有看到错误吗?

请帮助

能按预期工作的HTML代码:

<html>
   <head>
     <title></title>
   </head>
   <body bgcolor= #30CF9A>
     <form id="form1">
       <input type="text" id="input1">
       <input type="text" id="input2">
       <p id="p1">Hello</p>
       <p id="p2">joya</p>
       <button type="button" id="sosboton">boton</button>
     </form>
     <script src="test.js"></script>
   </body>

无效的HTML代码:

<html>
   <head>
     <title></title>
   </head>
   <body bgcolor= #30CF9A>
     <form id="form1">
       <input type="text" id="input1">
       <input type="text" id="input2">
       <p id="p1">Hello</p>
       <p id="p2">joya</p>
       <form id="form2">
         <p>HOLA!</p>
       </form>
       <button type="button" id="sosboton">boton</button>
     </form>
     <script src="test.js"></script>
   </body>

JavaScript代码:

var inp = document.getElementById('input1');
inp.onchange = function () {cambio()};

function cambio(){
  var $x = inp.value
  for (let y = 0; y < $x; y++) {
    let $form = document.getElementById('form1');
    let $p2 = document.getElementById('p2');
    let $cln = $p2.cloneNode(true);
    $cln.id = (`autogen${y}`);
    $form.insertBefore($cln, sosboton);
  }
}

1 个答案:

答案 0 :(得分:0)

这是HTML的问题,不允许嵌套表格。

我最终在原始表格中使用了DIV并复制了该DIV