Every one confusing regarding HTML DOM(Document object Model).There no confusion HTML DOM meansimagining html document with a tree Structure with Parent and Child relationship.every one knows that html is tag based and it allows tags inside tags .
Ex:
<p>
<b> Hello</b>
</p>
Here the bold tag <b> is inside para tag<p>
Now coming to the topic HTML DOM is introduced to change the properties of all the HTML elements dynamically by using java script.
The following Structue shows basic HTML DOM:
Example Structure with table tag
here i will give a basic example for changing visibility and hidden properties dynamically.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script>
function hidevisible(x)
{
if(x==1)
{
document.getElementById('text').style.visibility="hidden";
}
if(x==2)
{
document.getElementById('text').style.visibility="visible";
}
}
</script>
</HEAD>
<BODY>
<p id="text">Hello How are u </p>
<button onclick="hidevisible('1')">HIDE</button> <button onclick="hidevisible('2')" >visible</button>
</BODY>
</HTML>
OUTPUT:
Hello How are u


No comments:
Post a Comment