用原生js怎么动态添加一个js文件

JavaScript08

用原生js怎么动态添加一个js文件,第1张

1、直接document.write

<script language="javascript">

document.write("<script src='web.zhaicool.net/jquery.js'><\/script>")

</script>

2、动态改变已有script的src属性

<script src='' id="s1"></script>

<script language="javascript">

s1.src="web.zhaicool.net/jquery.js"

</script>

3、动态创建script元素

<script>

var oHead = document.getElementsByTagName('HEAD').item(0)

var oScript= document.createElement("script")

oScript.type = "text/javascript"

oScript.src="web.zhaicool.net/jquery.js"

oHead.appendChild( oScript)

</script>

其实原理就是利用dom动态的引入一个js到文件中来~就能和原有的js通信了~

可以直接用document.getElementById("divid").innerHTML = "<p>内容</p>"的方式来写。

多个可以循环进行处理。

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

可以通过for (var i = 0i <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对象。

第一个:a,创建一个img元素,然后添加到div节点下面。

第二个:innerHTML , 直接用HTML代码加入。

<!--

var img=document_createElement_x('img'),

fff=document.getElementByIdx_x('aaa')

img.setAttribute('src','http://www.blueidea.com/articleimg/bbsimg/topic5.gif')

img.style.position='absolute'

img.style.left=fff.offsetLeft+20+'px'

img.style.top=fff.offsetTop+30+'px'

fff.a(img)

//-->