js简单留言板添加元素节点案例附带代码源码

Javascript简单留言板添加元素节点案例附带代码源码
html代码如下：

1. <textarea name="" id="" cols="30" rows="10" style="resize: none;">
   
2.     </textarea>
   
3.     <button class="zidiu">发布</button>
   
4.     <ul class="zidiu1">
   
5.     </ul>

复制代码

js代码如下：

1. var text = document.querySelector('textarea');
   
2.   var btn = document.querySelector('.zidiu');
   
3.   var ul = document.querySelector('.zidiu1');
   
4. 
   
5.   btn.onclick = function() {
   
6.       if (text.value == '') {
   
7.           alert('请输入内容');
   
8.           return false;
   
9.       } else {
   
10.           var li = document.createElement('li');
    
11.           li.innerHTML = text.value;
    
12.           ul.insertBefore(li, ul.children[0]);
    
13.       }
    
14.   }

复制代码