Question

我想在外部javascript文件中创建一个我可以在以后重复使用的函数（即一般模块化的函数，可以在任何需要的javascript中使用）。我想用纯JavaScript做这个，而不是使用jQuery或innerHTML。

我希望此模块化功能执行以下操作： 1）删除孩子的元素 2）用新的子值替换这个孩子

例如，假设你有这段代码：

<p id="removeMe">This text needs to be removed</p>
<p id="nextPara">This is the paragraph that follows the replaced paragraph</p>

所以我需要：

  1) parentNode.removeChild(removeMe);
  2) var replacementParagraph = document.createElement('p');
  3) var replacementParagraphText =document.createTextNode("This is the replacementParagraph text);
  4) replacementParagraph.appendChild(replacementParagraphText);

现在我只需要弄清楚如何编写类似下面的模块化函数：

function removeReplace (parameter, parameter) {
   1) remove the child of the paragraph with the id of "removeMe"
   2) use insertBefore(newText, nextPara) to replace the child that was removed in step 1
}

非常感谢你的帮助，杰森

Answer 1

哦，它更容易，因为这个功能本身已经存在：.replaceChild()。实际上你已经有了算法，你只需要在javascript中编写它：

function replaceElementByParagraph(id, text) {
    var toremove = document.getElementById(id);
    if (!toremove) // in case no element was found:
        return false; // abort
    var para = document.createElement('p');
    para.appendChild(document.createTextNode(text));
    return toremove.parentNode.replaceChild(para, toremove);
}

javascript removeChild然后使用insertBefore将其替换为新文本

1 个答案: