在外部js里实现等页面加载完成了再执行脚本，即不用window.onload，也不将<script>块放在底部，也不使用库

Question

我想到一种方法可以使用定时器setTimeout，类似于这样
function $(string){ return document.getElementById(string); } setTimeout("",1000);
想请教各位有没有更好的方法呢，也不使用库，其实我很想知道jquery里是怎么操作的。

Answer 1

ready(function(){
  // dom ready 后执行这段代码。
});

ready 实现如下：

var isReady = false;
var readyList = [];

function ready(fn) {
  if (isReady) {
    setTimeout(function () {
      fn()
    }, 0);
    return;
  }
  readyList.push(fn);
}

function setReady() {
  if (isReady) {
    return;
  }

  isReady = true;
  for (var i = 0, n = readyList.length; i < n; i++) {
    readyList[i]();
  }
  readyList.length = 0;
}

(function () {
  if (document.readyState === 'complete') {
    setTimeout(setReady, 0);
  } else {
    document.addEventListener('DOMContentLoaded', setReady);
    window.addEventListener('load', setReady);
  }
}());

Answer 2

直接看司徒大大的avalon中的https://github.com/RubyLouvre/avalon/blob/master/src/18%20domReady.js 和jquery中的一样。