Question

我在<p>中有一个<DIV>元素列表，我希望在<p>任何一个<DIV>时替换<p>单击标签。

<div class="list">
 <p onClick="replaceWithDiv">para one</p>
 <p onClick="replaceWithDiv">para two</p>
 <p onClick="replaceWithDiv">para three</p>
</div>

when the second <p> is clicked I want it to change to

<div class="list">
 <p onClick="replaceWithDiv">para one</p>
 <div>NEW DIV</div>
 <p onClick="replaceWithDiv">para three</p>
</div>

我怎样才能在javacsript中做到这一点？非常感谢任何建议

Answer 1

这样的事情：

function replaceWithDiv(obj) {
    var div = document.createElement('div');
    div.innerHTML = 'NEW DIV';
    obj.parentNode.insertBefore(div, obj);
    obj.parentNode.removeChild(obj);
}

HTML：

<p onclick="replaceWithDiv(this)">para one</p>

http://jsfiddle.net/dfsq/kcZYW/

Answer 2

尝试replaceChild

function replaceWithDiv() 
    var div = document.createElement("DIV");
    //...
    this.parentNode.replaceChild(div, this);
}


<p onclick="replaceWithDiv.call(this)">para one</p>

如何在子元素列表中替换元素/节点？

2 个答案: