Sample Html Program using getElementsByName

< !--Simple Html Program using getElementsByName -- >

< html >

< head >
< script type="text/javascript" >
function getElements(){ 
            var DispayVar=document.getElementsByName("SampleInput")
            alert("\""+DispayVar[0].value+ "\" is the value you have entered!")
   }
< /script >
< /head >

< body >
< form >
Enter any value
< input name="SampleInput" type="text" size="20" >
<  input name="SampleInput" type="text" size="20"  >
< br >< br >< center >
< input name="mybutton" type="button" onclick="getElements()" value="Display" >
< /center >
< /form >
< /body >

< /html >

Output:-
Let us consider we have entered " Hello" in the firsttextbox then a pop window with " Hello is the value you have entered" will appear

Note:- getElementsByName()method returns a collection of objects with the same NAME attribute value .

Properties and Functions of getElementsByName Method

1. item: item function accepts a parameter as index of the item you want to get from the array of specified HTML elements.

E.g.:

var DispayVar =document. getElementsByName( "SampleInput" ). item(0)

alert(DispayVar.value);

above code will return the first element from the array collection having name attribute value "SampleInput".

2. tags: tags function of getElementsByName method also accepts one parameter as name of the HTML element e.g.: input or img. It returns only the specified HTML element from the array collection.

E.g.:

document. getElementsByName( "SampleInput" ). tags("img").

This function is the clone of Javascript getElementsByTagName method.

3. length: length property returns the number of HTML elements with specified name retrieved from the document.

E.g.:

document. getElementsByName( "SampleInput" ). length