javascript document.onload 对我不起作用?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18960838/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 13:50:51  来源:igfitidea点击:

document.onload not working for me?

javascript

提问by prk

Well I'm simply playing around with a userscript of GreaseMonkey and here's just something simple I attempt to do;

好吧,我只是在玩一个 GreaseMonkey 的用户脚本,这只是我尝试做的一些简单的事情;

function test() {
document.getElementById('elementhere').innerHTML = 'test';
}
document.onload = test();

It works if I go to the page I want to use it on and do "run" or "reload & run" - but it won't run automatically, which I'm trying to make it do by using document.onload.

如果我转到要使用它的页面并执行“运行”或“重新加载并运行”,它会起作用 - 但它不会自动运行,我试图通过使用 document.onload 来实现。

回答by Abraham

What you need is:

你需要的是:

window.onload = function () {
// do the work after everything was loaded (DOM, media elements)
}

document.onloadit doesn't exist. It works if you at least target some specific element from document for example:

document.onload它不存在。如果您至少针对文档中的某些特定元素,它会起作用,例如:

document.querySelector("img").onload = function ()
 {// do your thing after 'img' was loaded}

You have other options if you want to execute some code after the DOM is the only element ready without wait for media elements to load like:

如果您想在 DOM 是唯一准备好而无需等待媒体元素加载的元素之后执行一些代码,您还有其他选择,例如:

  • Import an async script tag loading the file with the code: You can place this tag wherever you want in DOM and it will not interrupt nothing, will load after the DOM finish to load. you should take a look to MDN documentationabout that.

  • If you take a look again in MDN documentationthey will recommend you in section Notesto use DOMContentLoaded and DOMFrameContentLoaded events which can be handling by addEventListener. So, if you do this:

  • 导入使用代码加载文件的异步脚本标签:您可以将此标签放置在 DOM 中任何您想要的位置,它不会中断任何内容,在 DOM 完成加载后加载。您应该查看有关此内容的MDN 文档

  • 如果您再次查看MDN 文档,他们会在注释部分建议您使用可由 addEventListener 处理的 DOMContentLoaded 和 DOMFrameContentLoaded 事件。所以,如果你这样做:

document.addEventListener('DOMContentLoaded', handlerFunc);

document.addEventListener('DOMContentLoaded', handlerFunc);

Will work for you.

会为你工作。

I hope this can be helpful for you...

我希望这对你有帮助......

回答by Niet the Dark Absol

When you write document.onload = test(), you are callingthe testfunction, and assigningits return value to the onloadhandler. This is clearly not what you intended.

当您编写 时document.onload = test(),您正在调用test函数,并将其返回值分配给onload处理程序。这显然不是你想要的。

document.onload = test;

This will assigna reference to the testfunction to the onloadhandler. When the event fires, thatis when your function will be called.

这将为处理程序分配对该test函数的引用onload。当事件触发时,会调用您的函数。

回答by CunningFatalist

Maybe do this:

也许这样做:

<body onload="test()">

Or is that not what you're looking for? If you want to do it without the HTML bit above, maybe try and replace document with window:

或者这不是你要找的?如果您想在没有上面的 HTML 位的情况下执行此操作,可以尝试将文档替换为窗口:

window.onload = function ()
{
   document.getElementById('elementhere').innerHTML = 'test';
} 

I would give that a go because of this:

因为这个,我会试一试:

window.onload vs document.onload

window.onload 与 document.onload

I know that posting a link to a link is lame, but you will see why I did that (hopefully).

我知道发布链接的链接是蹩脚的,但你会明白我为什么这样做(希望如此)。

Cheers!

干杯!

回答by Ujjwal Singh

It is because you are assigning the result of the testfunction instead of the function itself due to the parentheses ()on the last line.
Remove them and it may work.

这是因为test由于()最后一行的括号,您正在分配函数的结果而不是函数本身。
删除它们,它可能会起作用。

If not then:

如果没有,那么:

Apparently that is by design. [Chrome - v57]
Use document.addEventListener("DOMContentLoaded", <function_name>);instead.

显然这是设计使然。[ Chrome - v57]
使用document.addEventListener("DOMContentLoaded", <function_name>);代替。

See: Page lifecycle : DOMContentLoaded

请参阅:页面生命周期:DOMContentLoaded

回答by SantoshK

No Need to call the function on the page .. just you need to use below code which is best practices of coading

不需要调用页面上的函数..只需要使用下面的代码,这是编码的最佳实践

window.onload = function() {
    document.getElementById("txtCaptcha").value = code;
    document.getElementById("txtCaptchaDiv").innerHTML = code;
    }

回答by Shubham

If you are using Greasemonkey then you don't really need a using onload event since the Greasemoneky script is called only when DOMContentLoadedis fired.

如果您使用的是 Greasemonkey,那么您实际上并不需要 using onload 事件,因为 Greasemoneky 脚本仅在DOMContentLoaded被触发时才被调用。

The code in a Greasemonkey user script gets invoked when the DOMContentLoaded event fires (during event capture as of GM 0.8.6). It is a DOM event implemented by Mozilla, similar to window.onload.However, since it waits only for the DOM to load, instead of the entire page (including images, style sheets, and etc.) it happens sooner.

Greasemonkey 用户脚本中的代码在 DOMContentLoaded 事件触发时被调用(在 GM 0.8.6 的事件捕获期间)。它是一个由 Mozilla 实现的 DOM 事件,类似于 window.onload。然而,因为它只等待 DOM 加载,而不是整个页面(包括图像、样式表等),所以它会更快地发生。

http://wiki.greasespot.net/DOMContentLoaded

http://wiki.greasespot.net/DOMContentLoaded

I think you would just need to call test()without any event listeners.

我认为您只需要在test()没有任何事件侦听器的情况下调用。

回答by Ankit Agrawal

It's working but you can use alternate

它的工作,但你可以使用替代

window.init = test;

回答by Joe Marie

did you try this?

你试过这个吗?

<body onload="test()">

or

或者

    $(document).ready(function test() {
    document.getElementById('elementhere').innerHTML = 'test';
    }