TextArea中appendChild问题,怪怪~
在Textarea中添加一个DIV子结点,添加没有问题,添加完后, 
 发现在当前光标的前面多出了一个位置,然后只要用鼠标点一下Textarea,那个多出来的位置就自动被缩进了`~真奇怪!!想问一下,为什么会多出那个多余的位置呢?欢迎大家给点解决办法~怎么避免?     
  <HTML>  
  <HEAD>  
  <script   language= " ">  
  <!-- 
 	/* 
 	   *   在TextArea中添加入DIV的层 
 	   * 
 	   *   @Link:    
 	   */ 
 	function   appendDivChild(   parent,eareaRs,cityPair   ){ 
 		var   msgStyled   =   eareaRs;		 
 		var   newDiv   =   document.createElement( 'DIV ');			 
 		newDiv.innerHTML=   msgStyled;	 
 		parent.appendChild(   newDiv   );		  		  		 
 	}   
 	//获取Document中的对象实例 
 	// 
 	function   getObject(objName){ 
 		if(getObject){ 
 			return   eval( 'document.getElementById( " '   +   objName   +    ' ") '); 
 		}else{ 
 			return   eval( 'document.all. '   +   objName); 
 		} 
 	}   
 	/* 
 	   *   F12事件信息 
 	   * 
 	   *   @Link:    
 	   * 
 	   */ 
 	function   getResult(   areaIndex   ){  		 
 		if(   window.event.keyCode   !=   123){ 
 			return; 
 		}  		 
 		//F12按钮执行 
 		var   area   =   getObject(    "area "   +   areaIndex   );//显示平台 
 		appendDivChild(   area, "Test   CC   BB   UU>  ", "XMNPEK "   );  		 
 	   }	    
 -->  
  </script>  
  </HEAD>    
  <BODY>  
  <textarea   name= "area0 "   onKeyDown= "getResult(   0   ) "   rows= "20 "   cols= "50 ">  </textarea>  
  </BODY>  
  </HTML>  
------解决方案--------------------人有多大胆,程序就有多强悍? 
------解决方案--------------------div的问题,换成var newDiv = document.createElement( 'SPAN ');就没事了。