简易留言板

最新推荐文章于 2021-07-15 17:23:03 发布

原创最新推荐文章于 2021-07-15 17:23:03 发布 · 628 阅读

CC 4.0 BY-SA版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
</head>
<body>
    <ul class="items"></ul>
    <textarea name="" id="text" cols="30" rows="10"></textarea>
    <button "createLange()">点击留言</button>

</body>
<script type="text/javascript">
    var item=document.getElementsByClassName("items")[0]; //获取文本域
        function createLange() {
            var val=text.value;  //获取文本域内容
            var li=document.createElement("li");   //获取li
            li.innerHTML=val;   //将文本域内容赋给li
            item.appendChild(li);
            text.value="";  //清空文本域
            var bth=document.createElement("button");  // 获取button按钮
                bth.innerHTML="删除";
                li.appendChild(bth);   
                bth.function(){   // 给button加个点击事件
                    item.removeChild(li);
                }
        }
</script>
</html>