7 CREATING MARKUP ON THE FLY

What this chapter covers:

  • A quick look at the "old school" techniques: document.write and innerHTML
  • An in-depth look at the DOM methods createElement, createTextNode, appendChild, and insertBefore

The DOM methods you've seen so far have all been applied to previously existing markup. In this chapter, I'm going to show you some DOM methods that can alter the structure of a web page by creating new elements and modifying existing ones.

Most of the DOM methods you've seen so far have been very useful for identifying elements. Both getElementById and getElementsByTagName allow you to quickly and easily target specific element nodes in a document. These elements can then be manipulated using methods and properties like ...

Get DOM Scripting: Web Design with JavaScript and the Document Object Model now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.