JavaScript HTML DOM Document

## JS Basic

JS HOME JS Introduction JS How To JS Output JS Statements JS Comments JS Variables JS Data Types JS Objects JS Functions JS Operators JS Comparisons JS Conditions JS Switch JS Loop For JS Loop While JS Breaks JS Errors JS Validation

## JS Advanced

JS Object JS Number JS String JS Date JS Array JS Boolean JS Math JS RegExp

## JS HTML DOM

DOM Intro DOM Methods DOM Document DOM Elements DOM HTML DOM CSS DOM Events DOM Navigation DOM Nodes DOM Nodelist

## JS Browser BOM

JS Window JS Screen JS Location JS History JS Navigator JS PopupAlert JS Timing JS Cookies

## JS Libraries

JS Libraries JS jQuery JS Prototype

## JS Examples

JS Basic Examples JS Objects Examples JS DOM Examples JS HTML Examples JS Browser Examples JS Quiz JS Certificate JS Summary

## JS References

Javascript Objects HTML DOM Objects

# JavaScript HTML DOM Document

« Previous
Next Chapter »

With the HTML DOM, the document object is your web page.

## The HTML DOM Document

In the HTML DOM object model, the document object represent your web page.

The document object is the owner of all other objects in your web page.

If you want to access object in an HTML page, you start with acessing the document object.

Below is some examples of how you can use the document object to access and manipulate HTML.

The next chapters demonstrates all the methods.

## Finding HTML Elements

Method | Description
--- | ---
document.getElementById() | Finding an element by element id
document.getElemenstByTagName() | Finding elements by tag name
document.getElementsByClassName() | Finding elements by class name
document.forms[] | Finding elements by HTML element objects

## Changing HTML Elements

Method | Description
--- | ---
document.write(text) | Writing into the HTML output stream
document.getElementById(id).innerHTML= | Changing the inner HTML of an element
document.getElementById(id).attribute= | Changing the attribute of an element
document.getElementById(id).style.attribute= | Changing the style of an HTML element

## Adding and Deleting Elements

Method | Description
--- | ---
document.createElement() | Create an HTML element
document.removeChild() | Remove an HTML element
document.appendChild() | Add an HTML element
document.replaceChild() | replace an HTML element

## Adding Events Handlers

Method | Description
--- | ---
document.getElementById(id).onclick=function(){code} | Adding event handler code to an onclick event

« Previous
Next Chapter »

## Your suggestion:

Your E-mail (optional):

Page address:

Description:

Close [X]

## Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

## WEB HOSTING

Best Web Hosting UK Reseller Hosting Wow! $5 SSD Hosting

## WEB BUILDING

Download XML Editor
FREE Website BUILDER FREE Website Creator

## WEB RESOURCES

Web Statistics Web Validation

## SHARE THIS PAGE