JonMny
asked on
How to insert a DiV in to document
I am trying to insert a Div into a document this is the code, It works on simple forms but when I put it into the main form i get an error. I think it may be a nesting issue or somthing see sample code below..
'code to add div
diva = document.getElementById("t est")
divb = document.createElement("di v")
document.body.insertBefore (divb,diva .nextSibli ng)
divE.innerHTML = "<span style=\"color:red\">Test it</span>"
'html
function insertHere
set divD = document.getElementById("f irstDiv")
set divE = document.createElement("di v")
document.body.insertBefore divE,divD
divE.innerHTML = "<span style=\'color:red\'>Child E</span>"
Set NodeList = document.getElementsByTagN ame("div")
end function
<table border='1' cellpadding='0' cellspacing='0' width='25%' height='100%'><tr><td valign='top'>
<table border='0' cellspacing='1' cellpadding='0' width='100%' height='100%' bgcolor='#f1f1ed'><tr><td valign='top'>
<div id='masterdiv'>
<div class='menu' onclick="SwitchMenu('sub1' )"><img style='vertical-align: middle' width=20 height=20 src='icons/txtmenu.gif' border=0 hspace=3>Text Folders</div>
<span class='options' id='sub1'>
<div id='firstDiv'>
<div id="childb" class='option' onmouseover="getDiv(this)" onmouseout="this.style.bac kground='# f5f5f5'">
<a href='http://www.google.com'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
'=-=-=-=-=-=-=-=-=-=-=-=-= -=-=-=-=-
'Want to insert div here
'=-=-=-=-=-=-=-=-=-=-=-=-= -=-=-=-=-
<div class='option' onmouseover="this.style.ba ckground=' #D8E4F8'" onmouseout="this.style.bac kground='# f5f5f5'">
<a href='http://www.industriavirtual.com.br/master.asp?code=webpacks&subcode=basico'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
<div class='option' onmouseover="this.style.ba ckground=' #D8E4F8'" onmouseout="this.style.bac kground='# f5f5f5'">
<a href='http://www.google.com'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
</div>
</span>
etc...
'code to add div
diva = document.getElementById("t
divb = document.createElement("di
document.body.insertBefore
divE.innerHTML = "<span style=\"color:red\">Test it</span>"
'html
function insertHere
set divD = document.getElementById("f
set divE = document.createElement("di
document.body.insertBefore
divE.innerHTML = "<span style=\'color:red\'>Child E</span>"
Set NodeList = document.getElementsByTagN
end function
<table border='1' cellpadding='0' cellspacing='0' width='25%' height='100%'><tr><td valign='top'>
<table border='0' cellspacing='1' cellpadding='0' width='100%' height='100%' bgcolor='#f1f1ed'><tr><td valign='top'>
<div id='masterdiv'>
<div class='menu' onclick="SwitchMenu('sub1'
<span class='options' id='sub1'>
<div id='firstDiv'>
<div id="childb" class='option' onmouseover="getDiv(this)"
<a href='http://www.google.com'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
'=-=-=-=-=-=-=-=-=-=-=-=-=
'Want to insert div here
'=-=-=-=-=-=-=-=-=-=-=-=-=
<div class='option' onmouseover="this.style.ba
<a href='http://www.industriavirtual.com.br/master.asp?code=webpacks&subcode=basico'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
<div class='option' onmouseover="this.style.ba
<a href='http://www.google.com'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
</div>
</span>
etc...
ASKER
Not exactly what I wanted. I need to create a new div within the <div id='masterdiv'>. It works on simple pages but when I try to do it in a nested page like this I get errors...
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function insertHere(where){
var divObj = document.getElementById(wh
divObj.innerHTML = "<span style='color:red'>Test it</span>";
}
// -->
</script>
</head>
<body onload="insertHere('test')
<table border='1' cellpadding='0' cellspacing='0' width='25%' height='100%'><tr><td valign='top'>
<table border='0' cellspacing='1' cellpadding='0' width='100%' height='100%' bgcolor='#f1f1ed'><tr><td valign='top'>
<div id='masterdiv'>
<div class='menu' onclick="SwitchMenu('sub1'
<span class='options' id='sub1'>
<div id='firstDiv'>
<div id="childb" class='option' onmouseover="getDiv(this)"
<a href='http://www.google.com'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
<div id="test"></div>
<div class='option' onmouseover="this.style.ba
<a href='http://www.industriavirtual.com.br/master.asp?code=webpacks&subcode=basico'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
<div class='option' onmouseover="this.style.ba
<a href='http://www.google.com'><img style='vertical-align: middle' width=16 height=16 src='icons/txtfolder.gif' border=0 hspace=3>Text Links</a></div>
</div>
</span>
</body>
</html>