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