如何在div内容之上添加段落

如何在div容器的顶部添加多个段落标记，新标记。

 
recently added on top every time on click event recently added paragarph on top
 
added before recent
  

我正在使用追加，但每次我点击按钮它添加到底部我需要它添加在所有段的顶部请帮助。

Answer 1

您可以使用prepend在容器顶部添加段落：

 // HTML: 
Lorem ipsum
 $('div').prepend('
Bla bla bla'); 

更新 ：关于如何淡入段落的评论 – 使用fadeIn ：

 $("#pcontainer").prepend($('
This paragraph was added by jQuery.
').fadeIn('slow')); 

一个工作演示： http ： //jsbin.com/uneso

Answer 2

没有jQuery的更优雅的方式：

 var container = document.getElementById('pcontainer'); container.insertBefore(document.createElement("p"), container.firstChild); 

这假设容器btw中已经有一个元素。

Answer 3

非jQuery用户的示例：

 document.getElementById('pcontainer').innerHTML = '
new paragraph
' + document.getElementById('pcontainer').innerHTML; 

也许不是那么短而且不错:)

Answer 4

这是一种没有jQuery的方法：

 function prependParagraphs() { var choosenDiv = document.getElementById("pcontainer"); for(var i=0; i<5; i++) { var newP = document.createElement("p"); var text = document.createTextNode("new paragraph number: " + i); newP.appendChild(text); choosenDiv.insertBefore(newP, choosenDiv.firstChild); } } 

Answer 5

尝试使用prepend而不是append。

Answer 6

具体到您的HTML，它将是：

 $("#pcontainer").prepend('
here's a new paragraph!
');