javascript - 如何在没有 jQuery 的情况下检测 DOM 是否就绪并添加类？

Question

我想在不使用 jQuery 的情况下重写这一行，以便可以更快地应用它(并且在下载 jQuery 库之前)。这条线是...

$(document).ready(function() { $('body').addClass('javascript'); });

如果我将其添加到 html 元素中，我可以省略 DOM 就绪部分吗？但这样做的一个问题是验证器不喜欢 html 元素上的 class 属性，即使它是用 JS 插入的。

那么，如果没有 jQuery，我该如何重写呢？

Answer 1

如果你想重现 jQuery 的 document.ready 事件，你可以使用 onreadystatechange或DOMContentLoaded适用的事件:

function domReady () {
  document.body.className += " javascript";
  // ...
}

// Mozilla, Opera, Webkit 
if ( document.addEventListener ) {
  document.addEventListener( "DOMContentLoaded", function(){
    document.removeEventListener( "DOMContentLoaded", arguments.callee, false);
    domReady();
  }, false );

// If IE event model is used
} else if ( document.attachEvent ) {
  // ensure firing before onload
  document.attachEvent("onreadystatechange", function(){
    if ( document.readyState === "complete" ) {
      document.detachEvent( "onreadystatechange", arguments.callee );
      domReady();
    }
  });
}