document.getElementsByName():-
This function is used to call the html elements by Name Value of the Tag then to applay some task on same name value tags. This DOM Function is used to apply styles to multiple html elements which are defined by same name value.
Example:
<head>
<script>
function getstyle(col1, col2)
{
a=document.getElementsByName('t1');
for(i=0; i<a.length; i++)
{
a[i].style.color=col1;
a[i].style.backgroundColor=col2;
a[i].style.padding="12px";
a[i].style.border="double";
a[i].style.borderColor="red";
}
a=document.getElementsByName('p1');
for(i=0; i<a.length; i++)
{
a[i].style.color=col2;
a[i].style.backgroundColor=col1;
a[i].style.padding="6px";
}
}
</script>
</head>
<body>
<h1 name="t1">WELCOME TO JS</h1>
<p name="p1">Types Of DOM Functions</p>
<h2>1. document.getElementById()</h2>
<h2 name="t1">2. document.getElementsByName()</h2>
<h2 name="p1">3. document.getElementsByTagName()</h2>
<input type="button" value="Apply Style1" onClick="getstyle('red','yellow')" />
<input type="button" value="Apply Style2" onClick="getstyle('blue','orange')" />
<input type="button" value="Apply Style3" onClick="getstyle('green','pink')" />
</body>
Output:---------------------------------------------------->
This function is used to call the html elements by Name Value of the Tag then to applay some task on same name value tags. This DOM Function is used to apply styles to multiple html elements which are defined by same name value.
Example:
<head>
<script>
function getstyle(col1, col2)
{
a=document.getElementsByName('t1');
for(i=0; i<a.length; i++)
{
a[i].style.color=col1;
a[i].style.backgroundColor=col2;
a[i].style.padding="12px";
a[i].style.border="double";
a[i].style.borderColor="red";
}
a=document.getElementsByName('p1');
for(i=0; i<a.length; i++)
{
a[i].style.color=col2;
a[i].style.backgroundColor=col1;
a[i].style.padding="6px";
}
}
</script>
</head>
<body>
<h1 name="t1">WELCOME TO JS</h1>
<p name="p1">Types Of DOM Functions</p>
<h2>1. document.getElementById()</h2>
<h2 name="t1">2. document.getElementsByName()</h2>
<h2 name="p1">3. document.getElementsByTagName()</h2>
<input type="button" value="Apply Style1" onClick="getstyle('red','yellow')" />
<input type="button" value="Apply Style2" onClick="getstyle('blue','orange')" />
<input type="button" value="Apply Style3" onClick="getstyle('green','pink')" />
</body>
Output:---------------------------------------------------->
WELCOME TO JS
Types Of DOM Functions
No comments:
Post a Comment