mutation_event_listener.html | Explore in Territory

<!DOCTYPE html>
<html>
<head>
<script>
function removeNode(id) {
  var node = document.getElementById(id);
  node.parentNode.removeChild(node);
 }

function addElement(id) {
  var elem = document.createElement("div");
  elem.setAttribute("id", id);
  var text = document.createTextNode("Added node id=" + id);
  elem.appendChild(text);
  document.getElementById("topDiv").appendChild(elem);
 }

function changeText(id, newText) {
  var node = document.getElementById(id);
  node.childNodes[0].nodeValue = newText;
}
</script>
</head>

<body>

<div id="topDiv">
   <div id="div1">Div #1</div>
   <div id="div2">Div #2</div>
   <div id="div3">Div #3</div>
</div>

<button onclick="removeNode('div1')">Remove node</button><br>
<button onclick="addElement('bidule')">Add node</button><br>
<button onclick="changeText('div2', 'Bijour')">Change text</button><br>

</body>
</html>

chromium/third_party/blink/renderer/core/testing/data/listener/mutation_event_listener.html