JS 动态添加html内容

HTML代码

   <div>
        <input type="text" id="inp">
        <input type="button" value="添加" onclick="addElement()">
        <ul id="container">
            <li>内容1</li>
        </ul>

    </div>

JS代码

   function addElement(){
            var val = document.getElementById("inp").value;
            var tag = document.createElement("li");
            tag.innerText = val;
            document.getElementById("container").appendChild(tag);
            document.getElementById("inp").value = "";
        }

效果图

 

posted @ 2017-04-17 16:36  Vincen_shen  阅读(435)  评论(0)    收藏  举报