无刷新评论

 1 <head>
 2     <title></title>
 3     <style>
 4         #dv
 5         {
 6             border: 1px solid red;
 7              200px;
 8         }
 9     </style>
10     <script>
11         onload = function () {
12             btn.onclick = function () {
13                 //创建p标签
14                 var p = document.createElement("p");
15                 //将p标签加入div中
16                 //dv.appendChild(p);
17                 //dv.insertBefore(p, null);
18 　　　　　　　　　 //判断div里是否有p标签，如果没有就直接插入，如果有就获取全部p标签数组，在p[0]之前插入。
19                 if (dv.getElementsByTagName("p").length) {
20                     var pArr = dv.getElementsByTagName("p")
21                     dv.insertBefore(p, pArr[0])
22                 }
23                 else {
24                     dv.insertBefore(p, null);
25                 }
26                 //让txt框的内容等于p标签的内容innerHTML会忽略HTML代码，如果要显示HTML代码要用createTextNode
27                 p.innerHTML = txt.value;
28 
29             }
30         }
31     </script>
32 </head>
33 <body>
34     <textarea id="txt"></textarea><br />
35     <br />
36     <input type="button" value="发表评论" id="btn"></input>
37     <div id="dv">
38     </div>
39 </body>
40