javascript,如何在body节点下,用js加入一个<p>段落?

JavaScript05

javascript,如何在body节点下,用js加入一个<p>段落?,第1张

如果你的javascript 在body 标记前,则需要加上window.onload,等页面执行完才执行js,否则会找不到<body></body>标记。

window.onload = function(){

var testingText = '<p>hello</p>'

var rootElement = document.body

var newElement = document.createElement("div")

var newElementHtmlContent = document.createTextNode(testingText)

rootElement.appendChild(newElement)

newElement.appendChild(newElementHtmlContent)

}

可以直接用document.getElementById("divid").innerHTML

=

"<p>内容</p>"的方式来写。

多个可以循环进行处理。

假设段落文本是个数组:array。

可以通过for

(var

i

=

0

i

<

array.lengthi++)

{document.getElementById("divid").innerHTML

=

"<p>"+array[i]+"</p>"}的方式进行处理。

延展:

如果段落过多,直接使用

div.appendChild方法会不段刷新DIV对象,影响运行速度。

正确的方法应该使用

document对象的碎片方法。

document.createDocumentFragment

容器,最后再将这些碎片返回给DIV对象比较合理,例如:

var

strArrayList=[]

//

创建一个段落文本数组对象,这些段落文本可能是100个也可能是1000个。

strArrayList[0]='数据111.......'

strArrayList[1]='数据.......'

strArrayList[2]='数据.......'

strArrayList[3]='数据.......'

strArrayList[4]='数据.......'

//...数据n.....

var

div=document.getElementById('div1')

//获得DIV对象。

var

f=document.createDocumentFragment()

//创建碎片对象。

for(var

i=0i<strArrayList.lengthi++){

var

p=document.createElement('P')

//动态创建P标签。

p.appendChild(document.createTextNode(strArrayList[i]))//段落字符串。

f.appendChild(p)

//附加到碎片对象中。

}

div.appendChild(f)//最后返给DIV对象。