基础留言发布+管理尝试（html+css+javascript）

 

HTML 部分

 <textarea name="" id="" cols="30" rows="10">chromatica</textarea>
    <button>post</button>
    <ul>
    </ul>

CSS 部分

 ul {
            width: 200px;
            height: 200px;
            padding: 0;
        }


        li {
            background-color: lightpink;
            margin-bottom: 10px;

        }

        li a {
            float: right;

        }

JavaScript 部分

 var btn = document.querySelector('button');
    var text = document.querySelector('textarea');
    var ul = document.querySelector('ul');

    btn.onclick = function () {
        if (text.value == '') {
            alert('write something bitch!')
        } else {
            var li = document.createElement('li');
            li.innerHTML = text.value + "<a href='javascript:;'>delete </a>";
            ul.insertBefore(li, ul.children[0]);
            var as = document.querySelectorAll('a');
            for (var i = 0; i < as.length; i++) {
                as[i].onclick = function () {
                    ul.removeChild(this.parentNode);
                }
            }

        }
    }