<p>在script标签内,用js创建一个script元素并插入到document中,这种就是异步加载js文件了:<br />
(function() {<br />
var s = document.createElement('script');<br />
s.type = 'text/javascript';<br />
s.async = true;<br />
s.src = 'http://yourdomain.com/script.js';<br />
var x = document.getElementsByTagName('script')[0];<br />
x.parentNode.insertBefore(s, x);<br />
})();<br />
同步加载<br />
平常默认用的都是同步加载。如:<br />
<script src="http://yourdomain.com/script.js"></script><br />
同步模式又称阻塞模式,会阻止流览器的后续处理。停止了后续的文件的解析,执行,如图像的渲染。浏览器之所以会采用同步模式,是因为加载的js文件中有对dom的操作,重定向,输出document等默认行为,所以同步才是最安全的。<br />
通常会把要加载的js放到body结束标签之前,使得js可在页面最后加载,尽量减少阻塞页面的渲染。这样可以先让页面显示出来。<br />
同步加载流程是瀑布模型,异步加载流程是并发模型。<br />
js获取屏幕坐标<br />
<!DOCTYPE html><br />
<html xmlns="http://www.w3.org/1999/xhtml"><br />
<head><br />
<meta http-equiv="Content-Type" c /><br />
<meta http-equiv="X-UA-Compatible" c/><br />
<meta name="auther" c /><br />
<title>获取鼠标坐标</title><br />
</head><br />
<body><br />
<script type="text/javascript"><br />
function mousePosition(ev){<br />
if(ev.pageX || ev.pageY){<br />
return {x:ev.pageX, y:ev.pageY};<br />
}<br />
return {<br />
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,<br />
y:ev.clientY + document.body.scrollTop - document.body.clientTop<br />
};<br />
}<br />
function mouseMove(ev){<br />
ev = ev || window.event;<br />
var mousePos = mousePosition(ev);<br />
document.getElementById('xxx').value = mousePos.x;<br />
document.getElementById('yyy').value = mousePos.y;<br />
}<br />
document.onmousemove = mouseMove;<br />
</script><br />
X:<input type="text" /> Y:<input type="text" /><br />
</body><br />
</html><br />
注释:<br />
1.documentElement 属性可返回文档的根节点。<br />
2.scrollTop() 为滚动条向下移动的距离<br />
3.document.documentElement.scrollTop 指的是滚动条的垂直坐标<br />
4.document.documentElement.clientHeight 指的是浏览器可见区域高度</p>