【问题标题】:How remove dynamic fields with Javascript如何使用 Javascript 删除动态字段
【发布时间】:2018-11-12 11:20:45
【问题描述】:

我正在学习带有动态字段的 javascript,除了使它们与表格匹配之外,我希望能够消除它们,以便以后使用 css 我只需要使用javascript

javascript代码:

function create(){
    var div = document.getElementById("fields");
    var array=document.getElementsByName('txt[]');
    var length = array.length+1;

    var jump = document.createElement("P");

    var input = document.createElement("input");
    input.setAttribute("name", "txt[]");
    input.setAttribute("id", "txtCamp" + length);
    input.setAttribute("size", "20");
    input.className = "input";

    var input2 = document.createElement("input");
    input2.setAttribute("name", "txt2[]");
    input2.setAttribute("id", "txtCamp2" + length);
    input2.setAttribute("size", "20");
    input2.className = "input";

    var button = document.createElement('button');
    button.setAttribute("type", "button");
    button.setAttribute("id", "txtCampo3"+ length);
    button.innerHTML = 'Add field';
    button.setAttribute("onclick", "create()");

    var button2 = document.createElement('button');
    button2.setAttribute("type", "button");
    button2.setAttribute("id", "txtCampo3"+ length);
    button2.innerHTML = 'delete field';

    jump.appendChild(input);
    jump.appendChild(input2);
    jump.appendChild(button);
    jump.appendChild(button2);
    div.appendChild(jump);
}

还有html中的表格

<table width="50%"  border="0" cellspacing="5" cellpadding="7">
  <tr>
  <td>
    <input type="button" id="boton" value="Create field" onclick="create();" />
  </td>
  </tr>
  <tr>
    <th>Item1</th>
    <th>Item2</th>
  </tr>
  <tr>      <td>
      <div id="fields"></div>
    </td>
  </tr>
</table>

【问题讨论】:

  • 您的意思是要从创建的节点中删除属性?或者您想完全删除元素?
  • 是的先生,我需要从创建的节点中删除
  • 那么removeAttribute 可能就是你所需要的。
  • 非常感谢!!!以及如何完全删除元素?
  • 为此你需要remove

标签: javascript html field


【解决方案1】:

您可以通过首先获取特定元素然后删除它来编写函数

function removeElt(elementId) {
   var element = document.getElementById(elementId);
   element.parentNode.removeChild(element);
}

【讨论】:

    猜你喜欢
    • 2018-08-08
    • 2020-05-14
    • 1970-01-01
    • 2018-06-19
    • 2018-05-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-07-02
    相关资源
    最近更新 更多