判断JS脚本加载完成的方法：onload与readyState兼容处理

JS脚本加载完成判断方法

在实现按需加载功能时，通常需要检测脚本是否加载完毕，以便执行后续的回调函数。那么，如何准确判断脚本的加载状态呢？

对于支持标准事件的浏览器，可以通过监听JS对象的onload事件（即js.onload）来判断加载完成。该方式在Firefox 2、Firefox 3、Safari 3.1及以上版本以及Opera 9.6及以上版本中均能良好运行。然而，IE 6和IE 7并不支持此属性。针对这些旧版IE浏览器，可以采用js.onreadystatechange事件来追踪状态变化（通常包括loading、loaded、interactive和complete）。当状态值变为loaded或complete时，即可判定脚本加载完成并触发回调。

关于readyState状态，需要补充说明以下几点：

1. 处于interactive状态时，用户可以进行交互操作。\n2. Opera浏览器虽然也支持js.onreadystatechange，但其状态机表现与IE存在显著差异。

<script>
function include_js(file) {\n var _doc = document.getElementsByTagName('head')[0];\n var js = document.createElement('script');\n js.setAttribute('type', 'text/javascript');\n js.setAttribute('src', file);\n _doc.appendChild(js);
if (!/*@cc_on!@*/0) { //if not IE\n //Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload\n js.onload = function () {\n alert('Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload');\n }\n } else {\n //IE6、IE7 support js.onreadystatechange\n js.onreadystatechange = function () {\n if (js.readyState == 'loaded' || js.readyState == 'complete') {\n alert('IE6、IE7 support js.onreadystatechange');\n }\n }\n }
return false;\n}
include_js('http://www.planabc.net/wp-includes/js/jquery/jquery.js');\n</script>