Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

InnerHTML

Status
Not open for further replies.

Tarbuza

Technical User
Dec 13, 2000
56
0
0
US
How does innerHTML works? It's a newbie question. I would appreciate help.
 
InnerHTML basically controls the content between a opening
and a closing tag. You can use it to change content between
opening and closing tags too !!! Try this example:

<HTML>
<HEAD>

<style>
span{
background-color: 0000FF;
color: FFFFFF;
text-decoration: underline overline;
font: bold;
}
</style>

<script language=&quot;JavaScript&quot;>
<!--

function show(myMessage)
{
self.span1.innerHTML = myMessage;
}

function hide()
{
self.span1.innerHTML = '';
}

//-->
</script></HEAD>
<BODY>
<table cellpadding=&quot;2&quot;><tr><td>
<a href=&quot; onmouseover=&quot;show(this.value)&quot; onmouseout=&quot;hide()&quot;
value=&quot;Go to Cas Wegkamp's personal homepage !!!&quot;> Move cursor here to popup message </a>
</td><td>
<a href=&quot; onmouseover=&quot;show(this.value)&quot; onmouseout=&quot;hide()&quot;
value=&quot;It's a really cool homepage !!!&quot;> Move cursor here to popup message </a>
</td><td>
<a href=&quot; onmouseover=&quot;show(this.value)&quot; onmouseout=&quot;hide()&quot;
value=&quot;Check it out, you'll love it !!!&quot;> Move cursor here to popup message </a>
</td></tr></table><br>
<span id=&quot;span1&quot;></span><span>&lt;-- My Mouseover message !!!</span>
</BODY>
</HTML>

Just copy this into notepad and save the file as test.html
Look what happens when you go over the hyperlinks with your
mouse :)

I hope this helps, [bobafett] BobbaFet [bobafett]

Everyone has a right to my opinion.
E-mail me at caswegkamp@hotmail.com
 
All answers were correct. Try taking a look at the last link that DellComputerUser posted it is really excellent.

Try pasting this code inside a blank.html page and type html in the textarea and then see what appears at the bottom of the page :

<html>
<head>
<title>Example</title>
</head>
<body>

<script>
function fillMyDiv(html)
{
// get the reference to the div
var myDiv = document.all ? document.all['myDiv']: document.getElementById('myDiv') ;
// insert the content you had inside the textarea
myDiv.innerHTML = document.myForm.myHTML.value;
}
</script>

<form name=myForm>
<textarea name=myHTML cols=30 rows=30></textarea>
<input type=button onclick=&quot;fillMyDiv()&quot; value=&quot;test innerHTML&quot;>
</form>

<div id=myDiv></div>

</body>
</html> Gary Haran
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top