JavaScript Tutorial

Javascript provide DOM ( Document Object Model ) developed by the World Wide Web Consortium. its describes how all elements in an HTML page, like input fields, images, paragraphs etc .

This specification provides a platform and language-neutral interface that allows programs and scripts to dynamically access and change the content, structure and style of a document —usually HTML or XML—by providing a structured set of objects that correspond to the document’s elements.

DOM Types :

Javascript provide's several type of DOM Object.

DOM object	Definition
document	Represents the root node of the DOM tree and also Returns the document object for the page .
element	its Represents an instance of most structures and sub-structures in the DOM.
nodeList	A nodeList is equivalent to an array, but it is an array specific to storing elements.

There are a number of JavaScript methods specified by the DOM which allow you to access its structure.

DOM Method	Definition
getElementsByTagName(name) nodeList	Returns a nodeList of any elements that have a given tag specified by name.
element getElementById()	its Returns the element uniquely identified by its id identifier.
document.getElementsByName()	its method returns all the element of specified name.
innerHTML	This property can be used to write the dynamic html on the html document.

Example of document.getElementsByName() method :


<html>
<head>    
<script >  
    
function prasun()  
 {  
    
var all language =document.getElementsByName("language");  
    alert("Total language:"+all language.length);  
    }
  
    </script>  
    <form>  
    Hindi:<input type="radio" name="language" value="Hindi">  
    English:<input type="radio" name=
	"language" value="English">  
    Sanskrit:<input type="radio" name=
	"language" value="Sanskrit">  
     
 
<input type="button" onclick=
"prasun()" value="language">  
 </form> 
</html>
</head>

Output :

Example of document.getElementById() :


<html>
<head>

<script >
function notEmpty(){

	var myTextField = document.getElementById('myText');
	if(myTextField.value != "")
		alert("You entered: " + myTextField.value)
	else
		alert("prasant say enter some text ")		
}
</script>
<input type='text' id='myText' />
<input type='button' onclick='notEmpty()' value='CLICK' />

</html>
</head>