Element removeChild Method - Remove a <span> element from its parent and insert it to an <h1> element in another document: - Javascript DOM

Javascript examples for DOM:Element removeChild

  1. HOME
  2. Javascript
  3. DOM
  4. Element removeChild

Description

Element removeChild Method - Remove a <span> element from its parent and insert it to an <h1> element in another document:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<body>

<iframe src="http://java2s.com" style="height:400px;width:650px;"></iframe>

<div id="myDIV">
  <span id="mySpan" style="font-size:35px;">A Span element</span>
</div>/*from   w w w . jav a  2 s.co m*/

<button onclick="removeSpan()">Remove span</button>
<button onclick="myFunction()">Insert span</button>

<script>
var child = document.getElementById("mySpan");

function removeSpan() {
    child.parentNode.removeChild(child);
}

function myFunction() {
    var frame = document.getElementsByTagName("IFRAME")[0]
    var h = frame.contentWindow.document.getElementsByTagName("H1")[0];
    var x = document.adoptNode(child);
    h.appendChild(x);
}
</script>

</body>
</html>

Related Tutorials