Document Object Model (DOM) Object
Document Object Model (DOM) Object
When html document is loaded in the browser, it becomes a document object. It is the root
element that represents the html document. It has properties and methods. By the help of
document object, we can add dynamic content to our web page.
window.document
Is same as
document
According to W3C - "The W3C 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."
https://www.javatpoint.com/document-object-model 2/8
8/8/23, 9:39 AM Document Object Model (DOM) | JavaScript Document object - javatpoint
https://www.javatpoint.com/document-object-model 3/8
8/8/23, 9:39 AM Document Object Model (DOM) | JavaScript Document object - javatpoint
Method Description
writeln("string") writes the given string on the doucment with newline character at
the end.
getElementsByName() returns all the elements having the given name value.
getElementsByTagName() returns all the elements having the given tag name.
getElementsByClassName() returns all the elements having the given class name.
In this example, we are going to get the value of input text by user. Here, we are using
document.form1.name.value to get the value of name field.
Here, document is the root element that represents the html document.
value is the property, that returns the value of the input text.
Let's see the simple example of document object that prints name with welcome message.
<script type="text/javascript">
function printvalue(){
var name=document.form1.name.value;
alert("Welcome: "+name);
}
</script>
<form name="form1">
Enter Name:<input type="text" name="name"/>
<input type="button" onclick="printvalue()" value="print name"/>
https://www.javatpoint.com/document-object-model 4/8