HTML Modification with Document Object Model (DOM)

The Document Object Model (DOM) is a platform and language-neutral interface that allows programs and scripts to dynamically access and update the content, structure, and style of a document. HTML DOM is a standard object model and programming interface for HTML. Simply put, the HTML DOM is a standard for how to get, change, add, or delete HTML elements.

DOM treats everything in an HTML document as a node. For example, the entire document is one document node, the elements within the document are element nodes, and text within those elements is text node. For example, consider the code:

– The root node in the HTML above is <html>. All other nodes in the document are contained within <html>.
– The <html> node has two child nodes; <head> and <body>.
– The <head> node holds a <title> node. The <body> node holds a <h1> and <p> node.

So DOM treats an HTML document as a node hierarchy or a node tree in which there are parent-children relations between outer and inner nodes.

For the modification of the content of an HTML element, DOM uses the innerHTML property. The innerHTML property is useful for returning or replacing the content of HTML elements (including <html> and <body>). Consider the code:

In the above code, getElementById is a method to specific a particular element, while innerHTML is a property used for modification of the content. Alternatively, same modification can be performed through the use of childNodes and nodeValue properties. For example:

In this code, getElementById is a method, while childNodes and nodeValue are properties. The facility afforded by DOM is that the manipulation of individual elements within a large HTML document is made easy for the web programmer.

Looking for a quality hosting service? here are a few I suggest.
BlueHost | HostGator | Media Temple
Ali has been an entrepreneur in web, video and related technologies. Having worked with many business across the globe, Ali stands truly a great pillar in the business working with him.