码迷,mamicode.com
首页 > 其他好文 > 详细

创建新元素插入

时间:2017-01-20 14:42:33      阅读:150      评论:0      收藏:0      [点我收藏+]

标签:ack   pen   type   title   开始   javascrip   log   button   btn   

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>

</style>

</head>
<body>
<input id = "txt1" type = "text" value = ‘‘ />
<input id = "btn1" type = "button" value = "创建li" />
<ul id = "ul1">
</ul>
<script type="text/javascript">
    var oBtn = document.getElementById(btn1);
    var oUl = document.getElementById(ul1);
    var oTxt = document.getElementById(txt1);

    oBtn.onclick = function()
    {
        var oLi = document.createElement(li);
        var aLi = oUl.getElementsByTagName(li);
        //在父级.appendChicd(子节点);
        oLi.innerHTML = oTxt.value;
        //oUl.appendChild(oLi);
        if(aLi.length>0)
        {
            oUl.insertBefore(oLi,aLi[0]);
        }

        else
        {
            //IE下如果一开始没有li就不会有aLi[0],会报错
            oUl.appendChild(oLi);
        }
        oTxt.value = ‘‘;
    }
    //父级.appendChild(子节点);
    //父级.insertBrfore(子节点,在谁之前);
    //父级.removeChild(哪个子节点);
</script>
</body>
</html>

 

创建新元素插入

标签:ack   pen   type   title   开始   javascrip   log   button   btn   

原文地址:http://www.cnblogs.com/pjw2017/p/6322647.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!