在尝试替换元素时替换整个div

Question

我想用另一个替换元素。 然而，该元素与其他元素一起放在div中。 当我运行我的代码时，整个div被替换。 如何防止此行为？

function edit(e) {
   selectedElement = e.id
   var newElement = document.createElement("input");
   var newElementA = document.createTextNode("bla");
   newElement.appendChild(newElementA);
   var oldElement = document.getElementById(selectedElement);
   var parentDiv = oldElement.parentNode
   parentDiv.replaceChild(newElement, oldElement);
}

Answer 1

您不应该将文本节点附加到输入框。你应该设置值。

Here is a working codepen, based on your comments.

<div id="parentDiv">
  <div>
    hi
  </div>
  <a id="pleaseReplace" onclick="edit(event)">hi2</a>
  <div>
    hi3
  </div>
</div>


function edit(e) {
  selectedElement = document.getElementById(e.srcElement.id);
  var newElement = document.createElement("input");
  newElement.value = selectedElement.innerHTML;
  var parentDiv = selectedElement.parentNode
  selectedElement = parentDiv.replaceChild(newElement, selectedElement);
}