javascript 订阅 javascript
javascript 判断JS文件是否加载完成
在“按需加载”的需求中,我们经常会判断当脚本加载完成时,返回一个回调函数,那如何去判断脚本的加载完成呢?
我们可以对加载的 JS 对象使用 onload 来判断(js.onload),此方法 Firefox2、Firefox3、Safari3.1+、Opera9.6+ 浏览器都能很好的支持,但 IE6、IE7 却不支持。曲线救国 —— IE6、IE7 我们可以使用 js.onreadystatechange 来跟踪每个状态变化的情况(一般为 loading 、loaded、interactive、complete),当返回状态为 loaded 或 complete 时,则表示加载完成,返回回调函数。
对于 readyState 状态需要一个补充说明:
在 interactive 状态下,用户可以参与互动。
Opera 其实也支持 js.onreadystatechange,但他的状态和 IE 的有很大差别。
具体实现代码如下:
javascript 页面任意地方点击显示当前点击目标TAG
javascript 页面任意地方点击显示当前点击目标TAG
1 2 3 4 5 | document.onclick=function(e){ var e= e||event; var o=e["target"]||e["srcElement"]; alert(o.tagName.toLowerCase()); |
javascript 异步加载URL
javascript 异步加载URL
1 2 3 4 5 6 7 8 9 10 11 12 | function getJsFile(url, callBack){ var XH = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject('Msxml2.XMLHTTP'); XH.open('get',url,true); XH.onreadystatechange = function(){ if(XH.readyState == 4 && XH.status == 200){ if(window.execScript) window.execScript(XH.responseText); else eval.call(window, XH.responseText); eval(callBack)(); } } XH.send(''); } |
js获取URL参数
1 2 3 4 5 6 7 8 9 10 | //JS获取URL参数的函数 function GetQueryString(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); //var reg = new RegExp("(.*)\?(.*&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r!=null) return unescape(r[2]); return null; } alert(GetQueryString("参数名1")); |
javascript DOM 之createTreeWalker 搜索优化
javascript DOM Level 2 之createTreeWalker和createNodeIterator 深度搜索节点
注意:createTreeWalker和createNodeIterator都不支持IE6
javascript DOM操作之插入节点
javascript DOM操作之插入节点
<script type=”text/javascript”>
window.onload = function aa()
{
var oDiv = document.createElement(‘div’);
var oText = document.createTextNode(‘hello’);
oDiv.appendChild(oText);
var id = document.getElementById(‘a1′);
if(id.nextSibling.nodeType==1)//判断是否是元素节点,排除空的文本节点
{
nextId = id.nextSibling;
}
else
{
nextId = id.nextSibling.nextSibling;
}
nextId.appendChild(oDiv);
}
</script>
<div id=”a1″>1</div>
<div id=”a2″>2</div>
<div id=”a3″>3</div>