<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>无标题文档</title>
<script type=”text/javascript”>
function $(id) {
return document.getElementById(id);
}
</script>
</head> <body>
<div id=”childdiv” style=”width:100px;height:100px;background:red;color:white;display:none”>child div <input type=”button” value=”remove child div” onclick=”$(‘childdiv’).style.display=’none’;”/></div>
<div id=”parentdiv” style=”width:100px;height:100px;background:green;color:white;”>parent div </div>
<input type=”button” value=”appendchild” onclick=”$(‘parentdiv’).appendChild($(‘childdiv’));$(‘childdiv’).style.display=’block’;”/>
</body>
</html>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>无标题文档</title>
<script type=”text/javascript”>
function $(id) {
return document.getElementById(id);
}
</script>
</head> <body>
<div id=”childdiv” style=”width:100px;height:100px;background:red;color:white;display:none”>child div <input type=”button” value=”remove child div” onclick=”$(‘childdiv’).style.display=’none’;”/></div>
<div id=”parentdiv” style=”width:100px;height:100px;background:green;color:white;”>parent div </div>
<input type=”button” value=”appendchild” onclick=”$(‘parentdiv’).appendChild($(‘childdiv’));$(‘childdiv’).style.display=’block’;”/>
</body>
</html>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>无标题文档</title>
<script type=”text/javascript”>
function $(id) {
return document.getElementById(id);
} function createDiv(divid) {
if (!document.getElementById(divid)) {
var divObj = document.createElement(“DIV“);
divObj.id = divid;
divObj.style.width = 200 + ‘px‘;
divObj.style.height= 100 + ‘px‘;
divObj.style.backgroundColor=“red“;
divObj.innerHTML = ‘show child div:<br /><input type=”checkbox” name=”show[]” value=”1″ checked=”checked” />yes <input type=”checkbox” name=”show[]” value=”0″ />No<br /><input type=”button” value=”Remove Child Completely” onclick=”$(\‘parentdiv\‘).removeChild($(\” + divid + ‘\‘))”/>‘;
$(‘parentdiv‘).appendChild(divObj);
}
}
</script>
</head> <body>
<div id=”parentdiv” style=”width:100px;height:100px;background:green;color:white;”>parent div </div>
<input type=”button” value=”appendchild” onclick=”createDiv(‘childdiv’)”/>
</body>
</html>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>无标题文档</title>
<script type=”text/javascript”>
function $(id) {
return document.getElementById(id);
} function createDiv(divid) {
if (!document.getElementById(divid)) {
var divObj = document.createElement(“DIV“);
divObj.id = divid;
divObj.style.width = 200 + ‘px‘;
divObj.style.height= 100 + ‘px‘;
divObj.style.backgroundColor=“red“;
divObj.innerHTML = ‘show child div:<br /><input type=”checkbox” name=”show[]” value=”1″ checked=”checked” />yes <input type=”checkbox” name=”show[]” value=”0″ />No<br /><input type=”button” value=”Remove Child Completely” onclick=”$(\‘parentdiv\‘).removeChild($(\” + divid + ‘\‘))”/>‘;
$(‘parentdiv‘).appendChild(divObj);
}
}
</script>
</head> <body>
<div id=”parentdiv” style=”width:100px;height:100px;background:green;color:white;”>parent div </div>
<input type=”button” value=”appendchild” onclick=”createDiv(‘childdiv’)”/>
</body>
</html>
