HTML 页面中 JS 的执行顺序

Question

说我有这样的事情

<script type="text/javascript" src="somefile.js"></script>
<div>something</div>
<script type="text/javascript">
// Some INLINE javascript
</script>

是否保证（所有浏览器）在执行内联 js 代码时，somefile.js 都已加载并且它可以在它之前对 div 进行操作？

Answer 1

保证您可以从 somefile.js 访问代码。

但是，此时 DOM 尚未准备好，因此您无法访问 div。如果您想这样做，请使用以下构造：

<div>something</div>
<script type="text/javascript">
// document.write calls go here, not in onReady

function onReady() {
    document.getElementsByTagName('div')[0].setAttribute('class', 'loaded');
    // Or other inline JavaScript
}

if (document.addEventListener) {
    document.addEventListener('DOMContentLoaded', onReady, false);
} else {
    window.onload = onReady;
}
</script>

jQuery 大大简化了它，你只需要写

$(function() {
   // inline code ...
});