动态创建元素

动态创建元素:
                        document.createElement('元素名');
                        删除元素:
                            父级.removeChild(要删除的元素);
                        添加元素:
                                父级.appendChild(要添加的元素) ---->往后面添加;
                                父级.insertBefore(要添加的元素,添加到谁的前面) ---->往某个元素前面添加;
                        appendChild()和insertBefore()类似于剪切的功能;
 发送文字:
                                window.onload=function(){
                                                var oTxt=document.getElementById("txt");
                                                var oBtn=document.getElementById("btn");
                                                var oBox=document.getElementById("box")
                                                
                                                oBtn.onclick=function(){     //按钮点击添加新的li;
                                                    sendMess();
                                                }
                                                
                                                oTxt.onkeydown=function(ev){  //oTxt,键盘按下添加新的li;
                                                                var oEv=ev||event;
                                                                if(oEv.keyCode==13){ //enter键
                                                                    sendMess();
                                                                }
                                                }
                                                function sendMess(){
                                                                var aLi=document.createElement('li');    //创建一个新元素；
                                                                aLi.innerHTML=oTxt.value+'<a href="javascript:;">删除</a>';
                                                                if(oBox.children.length){                                        //oBox.children.length为真，执行if
                                                                            oBox.insertBefore(aLi,oBox.children[0]);
                                                                }
                                                                else{oBox.appendChild(aLi);}
                                                                oTxt.value='';
                                                                aLi.children[0].onclick=function(){    //a点击从ul中删除整个li;
                                                                oBox.removeChild(this.parentNode);
                                                            }
                                                }
                                                
                                            }