[学习笔记]JavaScript基础--DOM创建元素

Mr_Lan_

于 2015-08-07 01:14:35 发布

阅读量275

点赞数

分类专栏： JavaScript基础

本文链接：https://blog.csdn.net/Mr_Lan_/article/details/47328157

版权

JavaScript基础专栏收录该内容

20 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<meta charset="utf-8" />
    <script>
        window.onload = function ()
        {
            var oBtn = document.getElementById('btn1');
            var oUl = document.getElementById('ull');
            var oTxt = document.getElementById('txt1');
            
            oBtn.onclick = function ()
            {
                var oLi = document.createElement('li');
                var aLi = oUl.getElementsByTagName('li');

                oLi.innerHTML = oTxt.value;

                //父级.appendChild(子节点);
                //oUl.appendChild(oLi);

                //往最前面插入元素
                //oUl.insertBefore(oLi,aLi[0]);

                if (aLi.length > 0)
                {
                    oUl.insertBefore(oLi, aLi[0]);
                }
                else
                {
                    oUl.appendChild(oLi);
                }
            };
        };
    </script>
</head>
<body>
    <input id="txt1" type="text"/>
    <input id="btn1" type="button" value="创建li"/>
    <ul id="ull">

    </ul>
</body>
</html>

Mr_Lan_

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
[学习笔记]JavaScript基础--DOM创建元素

window.onload = function () { var oBtn = document.getElementById('btn1'); var oUl = document.getElementById('ull'); var oTxt = document.getElementById('txt1
复制链接

扫一扫

专栏目录