DOM应用时的一个问题？
<!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>
<title> DOM adding </title>
<meta http-equiv= "content-type " content= "text/html; charset=ISO-8859-1 " />
<script type = "text/javascript ">
<!--
function makeNode(str){
var newParagraph = document.createElement( "p ");
var newText = document.createTextNode(str);
newParagraph.appendChild(newText);
return newParagraph;
}
function appendBefore(nodeId,str){
var node = document.getElementById(nodeId);
var newNode = makeNode(str);
if(node.parentNode)
node.parantNode.insertBefore(newNode,node);
}
function insertWidthin(nodeId,str){
var node = document.getElementById(nodeId);
var newNode = makeNode(str);
node.appendChild(newNode);
}
function appendAfter(nodeId,str){
var node = document.getElementById(nodeId);
var newNode = makeNode(str);
if(){
if(node.nextSibling) node.parentNode.insertBefore(newNode,node.nextSibling);
else node.parentNode.appendChild(newNode);
}
}
//-->
</script>
</head>
<body>
<h1> DOM Insert and Append </h1>
<!--script>
alert( "body Ok!! ");
</script-->
<hr>
<div style = "background-color:#66ff00 ">
<div id= "innerDiv " style= "background-color:#ffcc00; "> </div>
</div>
<hr>
<form id = "form1 " name = "form1 " action = "# " method = "get ">
<input type = "text " id = "field1 " name = "field1 ">
<input type = "button " value= "Before " onclick= "appendBefore( 'innerDiv ',document.form1.field.value); ">
<input type = "button " value= "Middle " onclick= "insertWithin( 'innerDiv ',document.form1.field.value); ">
<input type = "button " value= "After " onclick= "appendAfter( 'innerDiv ',document.form1.field.value); ">
</form>
</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>
<title> DOM adding </title>
<meta http-equiv= "content-type " content= "text/html; charset=ISO-8859-1 " />
<script type = "text/javascript ">
<!--
function makeNode(str){
var newParagraph = document.createElement( "p ");
var newText = document.createTextNode(str);
newParagraph.appendChild(newText);
return newParagraph;
}
function appendBefore(nodeId,str){
var node = document.getElementById(nodeId);
var newNode = makeNode(str);
if(node.parentNode)
node.parentNode.insertBefore(newNode,node);
}
function insertWithin(nodeId,str){
var node = document.getElementById(nodeId);
var newNode = makeNode(str);
node.appendChild(newNode);
}
function appendAfter(nodeId,str){
var node = document.getElementById(nodeId);
var newNode = makeNode(str);
if(node.nextSibling) node.parentNode.insertBefore(newNode,node.nextSibling);
else node.parentNode.appendChild(newNode);
}
//-->
</script>
</head>
<body>
<h1> DOM Insert and Append </h1>
<!--script>
alert( "body Ok!! ");
</script-->
<hr>
<div style = "background-color:#66ff00 ">
<div id= "innerDiv " style= "background-color:#ffcc00; "> </div>
</div>
<hr>
<form id = "form1 " name = "form1 " action = "# " method = "get ">
<input type = "text " id = "field1 " name = "field1 ">
<input type = "button " value= "Before " onclick= "appendBefore( 'innerDiv ',document.form1.field1.value); ">
<input type = "button " value= "Middle " onclick= "insertWithin( 'innerDiv ',document.form1.field1.value); ">
<input type = "button " value= "After " onclick= "appendAfter( 'innerDiv ',document.form1.field1.value); ">
</form>
</body>
</html>