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 TouchToneTommy 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
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