如何检测网页何时载入?

I want to write an application that detects when a page is loaded in the browser, then I should be able to insert content on top of the loaded web page? Anybody with an idea on how to do that?

我想编写一个应用程序来检测页面何时被加载到浏览器中，那么我应该能够在加载的web页面顶部插入内容?有人知道怎么做吗?

Please note that I should be able to do this in any browser (Firefox/IE).

请注意，我应该可以在任何浏览器(Firefox/IE)中这样做。

What language should I use to help me do this?

我应该用什么语言来帮助我做这件事?

How do I detect this from an external application?

我如何从外部应用程序检测到这个?

How should I integrate this with the browser?

如何将其与浏览器集成?

7 个解决方案

#1

You would use javascript to do this. If you don't know how to use javascript, I would recommend reading through some tutorials first.

您可以使用javascript来实现这一点。如果您不知道如何使用javascript，我建议您先阅读一些教程。

After you have a basic understanding of javascript, you can detect when a page has loaded by using the window.onload event.

在您对javascript有了基本的理解之后，您就可以通过使用窗口来检测页面是否加载了。onload事件。

window.onload = function() {
  addPageContents();  //example function call.
}

Edit: If you want to add more than one onload function, and not use a javascript library, you can wrap your own onload hanlder.

编辑:如果您想添加一个以上的onload函数，而不使用javascript库，您可以包装自己的onload hanlder。

window.whenloaded = function(fn) {
  if (window.onload) {
    var old = window.onload;
    window.onload = function() {
      old();
      fn();
    }
  } else {
    window.onload = fn;
  }
}

#2

Why not use listeners?

为什么不使用监听器呢?

// Everything but IE
window.addEventListener("load", function() {
    // loaded
}, false); 

// IE
window.attachEvent("onload", function() {
    // loaded
});

This way you can add as many Listeners as you want, you can also detach them! removeEventListener and detachEvent.

通过这种方式，您可以添加任意数量的侦听器，也可以分离它们!removeEventListener和之后。

#3

Better than onload is to use a function of an existing framework, because onload does sometimes respond after all the resources (images and so on) are loaded and not only the page.

比onload更好的是使用现有框架的功能，因为onload有时会在加载所有资源(图像等)之后响应，而不仅仅是页面。

For example jQuery:

例如jQuery:

$(document).ready( function() {
    // do stuff
})

#4

In Javascript, you have the onload event.

在Javascript中，有onload事件。

Edit: an example:

编辑:一个例子:

<html>
  <head>...</head>
  <body onload="doSomethingWhenPageIsLoaded();">
    ...
  </body>
</html>

#5

Javascript using the onLoad() event, will wait for the page to be loaded before executing.

Javascript使用onLoad()事件，将等待页面在执行之前被加载。

<body onload="somecode();" >

If you're using the jQuery framework's document ready function the code will load as soon as the DOM is loaded and before the page contents are loaded:

如果您正在使用jQuery框架的document ready函数，那么在加载DOM和加载页面内容之前，代码将立即加载:

$(document).ready(function() {
    // jQuery code goes here
});

#6

Javascript's OnLoad event for the body does what you want.

Javascript的OnLoad事件可以满足您的需求。

<body onload="somefunc();">

#7

-1

Your query can be solved easily by this helpful link: OnLoad W3School

您的查询可以通过这个有用的链接轻松解决:OnLoad W3School

If you want loading status:

如果您想要装载状态:

You can do that using simple Javascript

您可以使用简单的Javascript来实现这一点

if (document.readyState == "completed") {
    alert("Your page is loaded");
}

Return Value: A String, representing the status of the current document.

返回值:一个字符串，表示当前文档的状态。

One of five values:

五个值之一:

uninitialized - Has not started loading yet
未初始化-尚未开始加载
loading - Is loading
加载,加载
loaded - Has been loaded
加载-已加载。
interactive - Has loaded enough and the user can interact with it
交互-已经加载足够的用户可以与它交互
complete - Fully loaded
完成,满载

For more details visit W3Schools - document.readystate.

更多细节请访问W3Schools - document.readystate。

Hope this clears your thoughts.

希望这能让你思路清晰。

#1