[英]replace html content with other using javascript
i have html structure like below 我有像下面这样的html结构
<div class="block-compose">
<button class="icon icon-smiley btn-emoji"></button>
<div tabindex="-1" class="input-container">
<div class="input-emoji">
<div class="input-placeholder" style="display: none;">Type a message</div>
<div dir="auto" spellcheck="true" data-tab="1" contenteditable="true" class="input">how r u</div>
</div>
</div>
<div class="ptt-container"><span><button class="icon btn-icon icon-ptt"></button></span></div></div>
now i want to replace 现在我想替换
<div class="ptt-container"><span><button class="icon btn-icon icon-ptt"></button></span></div>
by 通过
<button class="icon btn-icon icon-send send-container"></button>
i am facing bit difficult do via javascript i am able to do it via jquery . 我面临有点困难通过javascript我可以通过jquery做到这一点。
please help me with this 请在这件事上给予我帮助
you need to use replaceChild
from the parent:- 你需要使用父母的
replaceChild
: -
var container = document.getElementsByClassName('ptt-container')[0]; var button = document.createElement('button'); button.className = 'icon btn-icon icon-send send-container'; container.parentElement.replaceChild(button, container);
<div class="block-compose"> <button class="icon icon-smiley btn-emoji"></button> <div tabindex="-1" class="input-container"> <div class="input-emoji"> <div class="input-placeholder" style="display: none;">Type a message</div> <div dir="auto" spellcheck="true" data-tab="1" contenteditable="true" class="input">how r u</div> </div> </div> <div class="ptt-container"><span><button class="icon btn-icon icon-ptt"></button></span> </div> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.