何时使用 dom:loaded / document.ready 事件

发布于 2024-09-08 07:36:39 字数 153 浏览 7 评论 0原文

当我使用使用prototype/jquery将数据“附加”到现有元素的方法时，将此类逻辑包装在 document.observe("dom:loaded", foo)/中是否是一个好习惯$(document).ready(foo) 函数？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

妞丶爷亲个 2024-09-15 07:36:39

如果没有就绪/加载事件，您的代码将不会触发，除非它位于页面底部。这是因为当从部分（在正文之前执行）读取代码时，这些元素不存在。

试试这个：

$("body").animate({'background-color', '#ff0000'}, 2000);

然后试试这个：

$(document).ready(function() {
    $("body").animate({'background-color', '#ff0000'}, 2000);
});

你就会明白我的意思了:)

Without a ready/loaded event, your code won't fire unless it's at the bottom of the page. This is because the elements don't exist when the code gets read from the <head> section (which executes before the body).

Try this:

$("body").animate({'background-color', '#ff0000'}, 2000);

And then try this:

$(document).ready(function() {
    $("body").animate({'background-color', '#ff0000'}, 2000);
});

You'll see what I mean :)

回复收藏 0 原文

甜心小果奶 2024-09-15 07:36:39

好吧，考虑在 DOM/window 准备好之前引用元素是行不通的，除非它是 html 元素，或者您直接在标记中的元素后面注入它，是的，这是真正完成它的唯一方法。

<!doctype html>
<html>
    <head>
        <script>alert( document.getElementById('foo') );</script>
    </head>
    <body>
        <p id="foo"></p>
    </body>
</html>

上面的方法会失败并返回 null。

Well, considering referencing elements before DOM/window ready will not work unless it's the html element or you are injecting it after the element in the markup directly, yes it's the only way to really get it done.

<!doctype html>
<html>
    <head>
        <script>alert( document.getElementById('foo') );</script>
    </head>
    <body>
        <p id="foo"></p>
    </body>
</html>

The above would fail and return null.

回复收藏 0 原文

~没有更多了~