如何检测DOM就绪并在没有jQuery的情况下添加类？
如何检测DOM就绪并在没有jQuery的情况下添加类？
提问于 2009-11-25 14:49:22
我想在不使用jQuery的情况下重写这一行，这样就可以更快地应用它(并且在下载jQuery库之前)。台词是..。
$(document).ready(function() { $('body').addClass('javascript'); });如果我将其添加到html元素中，是否可以省略DOM就绪部分？但是，这样做的一个问题是验证器不喜欢html元素上的类属性，即使它是用JS插入的。
那么，如果没有jQuery，我该如何重写呢？
回答 8
Stack Overflow用户
回答已采纳
发布于 2009-11-25 15:11:46
如果您希望重现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();
}
});
}Stack Overflow用户
发布于 2009-11-25 14:55:24
我不知道vanilla JS，但你可以这样写：
document.getElementsByTagName('body')[0].className += ' javascript';在页面底部(在关闭body标记之前)。
Stack Overflow用户
发布于 2009-11-25 18:51:11
如果您的目标是在页面加载时立即将类添加到body中，可能是为了隐藏非JS-fallback元素，则可以立即在body标记中执行此操作，而不是等待任何事件：
<body>
<script type="text/javascript">
document.body.className+= ' javascript';
</script>(尽管一般来说，如果这是目的，最好在使用脚本元素替换它们时删除回退元素，这样如果一段脚本出错，页面上的所有其他组件都不会中断。)
这是绑定到元素的最快方法:在创建元素之后立即绑定(如果只需要更改元素，则在开始标记内；如果需要更改其内容，则紧跟在结束标记之后)。然而，这种方法确实倾向于用丑陋的<script>块散落在页面上，这就是为什么更多的人将代码全部放在底部或使用加载/就绪处理程序。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1795089
复制相关文章
相似问题