dynamicallyModifiedPage.html 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <?xml version="1.0">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4. <title>Delayed remove of an element</title>
  5. <script type="text/javascript">
  6. var parentNode;
  7. var elementId;
  8. function timedRemove()
  9. {
  10. var t = setTimeout('removeElement()', 500);
  11. t = setTimeout('insertElement()', 2000);
  12. }
  13. function removeElement()
  14. {
  15. var element = document.getElementById('element-to-remove');
  16. elementId = element.id;
  17. parentNode = element.parentNode;
  18. parentNode.removeChild(element);
  19. }
  20. function insertElement()
  21. {
  22. var newElement = document.createElement('p');
  23. newElement.setAttribute('id', elementId);
  24. newElement.innerHTML = 'new element';
  25. parentNode.appendChild(newElement);
  26. }
  27. </script>
  28. </head>
  29. <body>
  30. <form>
  31. <input id="buttonDelete" type="button" value="element will be removed in half a second"
  32. onclick="timedRemove()"/>
  33. </form>
  34. <p id="element-to-remove">element</p>
  35. </body>
  36. </html>