您当前的位置: 首页 > 学无止境 > JS经典实例 网站首页JS经典实例
javascript学习笔记-动态加载脚本和样式
发布时间:2018-04-05 18:10:01编辑:雪饮阅读()
元素位置
获取元素距离页面上、左的距离
var box=document.getElementById("box");
//alert(box.getBoundingClientRect());
//元素上边距离页面上边的距离
alert(box.getBoundingClientRect().top);
//元素右边距离页面左边的距离
alert(box.getBoundingClientRect().right);
//元素下边距离页面上边的距离
alert(box.getBoundingClientRect().bottom);
//元素左边距离页面左边的距离
alert(box.getBoundingClientRect().left);
动态加载javascript脚本文件的顺序问题
(1)按照这样执行的话,是无法获取对象的,因为网页刚加载完毕,才创建这个script,那么就直接获取,这几乎是同步的,这样是不可以获取到的。
window.onload=function(){
var head=document.getElementsByTagName("head")[0];
var script=document.createElement("script");
script.setAttribute("type","text/javascript");
script.setAttribute("src","BrowserDetect.js");
head.appendChild(script);
alert(typeof BrowserDetect);
}
(2)而这样则可以,因为在网页加载过程中就已经开始创建了,到网页加载完毕已经可以获取了。
window.onload=function(){
alert(typeof BrowserDetect);
}
var head=document.getElementsByTagName("head")[0];
var script=document.createElement("script");
script.setAttribute("type","text/javascript");
script.setAttribute("src","BrowserDetect.js");
head.appendChild(script);
动态创建script标签
<script>
var head=document.getElementsByTagName("head")[0];
var script=document.createElement("script");
script.setAttribute("type","text/javascript");
/*
var scriptText=document.createTextNode("alert('雪饮大侠')");
script.appendChild(scriptText);
*/
//与上面等效
script.text="alert('雪饮大侠')";
head.appendChild(script);
</script>
关键字词:javascript,动态,脚本,样式