document 例子

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript">
        window.onload=function(){
        document.getElementById("btn_ID").onclick=function(){
/*            alert("213");*/
            //获取文本框的值
            var nameValue=document.getElementById("userid").value;
            var EValue=document.getElementById("EID").value;
            var PhoneValue=document.getElementById("PhoenID").value;
           // alert(EValue);
            //获取td
            var nameTD=document.createElement("td");
            var nameText=document.createTextNode(nameValue);
            nameTD.appendChild(nameText);

            var ETD=document.createElement("td");
            var EText=document.createTextNode(EValue);
            ETD.appendChild(EText);

            var PhoneTD=document.createElement("td");
            var PhoneText=document.createTextNode(PhoneValue);
            PhoneTD.appendChild(PhoneText);

            var DelTD=document.createElement("td");
            var aElement=document.createElement("a");
            aElement.setAttribute("href","deleteEmp?id="+nameValue);
            var DelText=document.createTextNode("删除");
            aElement.appendChild(DelText);
            DelTD.appendChild(aElement);


            //增加tr 把td增加到tr上
            var tr=document.createElement("tr");
            tr.appendChild(nameTD);
            tr.appendChild(ETD);
            tr.appendChild(PhoneTD);
            tr.appendChild(DelTD);

            //吧tr增加到table上
            var tableElement=document.getElementById("tableExample");
            tableElement.appendChild(tr);
            //删除
            aElement.onclick=function(){
                //使网页链接失效
                return DelTr(aElement);
            }
            function DelTr(a){
                var name= a.parentNode.parentNode.firstChild.firstChild.nodeValue;
                //alert(name);
                var flag=window.confirm("你真的要删除"+name+"这行么?");
                if(!flag){
                    return false;
                }
                //获取tr的parent
                var TrParent=aElement.parentNode.parentNode.parentNode;
                //获取tr
                var Tr=aElement.parentNode.parentNode;
                //删除
                TrParent.removeChild(tr);
                //网页链接失效
                return false;
            }
        }

        }


    </script>
</head>
<body>
添加用户:<br/>
用户名:<input type="text" name="user"id="userid"/>
Email:<input type="text" name="Ename" id="EID"value="qinxia@so.com"/>
电话:<input type="text" name="Phonename" id="PhoenID"/><br/>
<input type="button"value="提交"id="btn_ID"/>
<table border="1" id="tableExample">
    <tr><td>用户名</td><td>Email</td><td>电话</td><td>删除</td></tr>

</table>



</body>
</html>
document 例子

推荐阅读
