问题描述
我正在使用jQuery JavaScript库。我喜欢在设置DOM时触发的
$（document）上的事件侦听器准备就绪。 （非常类似于.onload）
我会发现它非常有用，如果有一个事件监听器它与此类似的行为非常相似，但是当元素完全加载时会触发。 （fe：Picture，div等）
我会欣赏jQuery或JavaScript方法。
当一个任意的DOM元素（如< div> ）准备就绪时，没有触发任何事件。图像具有自己的加载事件，以便在图像数据已加载并已被渲染并且其他一些特殊类型的元素具有事件时通知您。但是，常规DOM元素没有这样的事件。
如果您希望JavaScript代码在任意DOM元素准备就绪时立即执行，那么唯一的方法就是那就是在这个DOM元素之后放置一个内联脚本的函数调用。在那一点上，DOM元素将准备就绪，但DOM的其余部分可能尚未准备就绪。否则，脚本可以放置在文档的末尾，或者当整个文档准备就绪时，脚本可以被触发。
这是jQuery中现有的加载事件表单（这些都可以在纯JS中完成）：
//特定图像加载图像数据
$（＃myImage）。load（fn）;
//当文档中的所有元素都被加载并准备好操作
$（document）.ready（fn）;
//当DOM和所有动态加载的资源（如图像）都准备好
$（window）.load（fn）;
在jQuery中，您还可以动态加载内容，并在使用 .load（）这样的方法：
$（#result ）.load（ajax / test.html，function（）{
alert（Load was perform。）;
}）;
在内部，这只是一个ajax调用来获取数据，然后在数据具有之后调用回调被ajax检索，然后插入到文档中。它不是一个本地事件。
如果你有一些代码动态加载元素到DOM和你想知道这些DOM元素何时出现，那么最好的方式就是知道它们准备好了什么时候才可以将代码添加到DOM中来创建某种事件来告诉你什么时候准备好了。这样可以防止电池浪费轮询，试图找出元素是否现在在DOM中。
还可以使用，以查看对DOM进行了哪些更改的具体类型。 / p>
I am using jQuery JavaScript library.I like the event listener ready on $(document) that fires when the DOM is set up.
( Pretty similar to .onload )
I would find it very useful, if there was an event listener wich has a very similar behaviour to this, but fires when an element is fully loaded. (f.e.: Picture, a Div, such )
I would appreciate both jQuery or JavaScript methods.
There is no event fired when an arbitrary DOM element such as a <div> becomes ready. Images have their own load event to tell you when the image data has been loaded and has been rendered and a few other special types of elements have an event. But, regular DOM elements do not have such an event.
If you want javascript code to be executed as soon as an arbitrary DOM element is ready, the only way to do that is to place a function call in an inline script right after that DOM element. At that point that DOM element will be ready, but the rest of the DOM afterwards may not yet be ready. Otherwise, the script can be placed at the end of the document or the script can be fired when the whole document is ready.
Here are the existing load events expressed in jQuery form (these can all be done in plain JS too):
// when a particular image has finished loading the image data
$("#myImage").load(fn);
// when all elements in the document are loaded and ready for manipulation
$(document).ready(fn);
// when the DOM and all dynamically loaded resources such as images are ready
$(window).load(fn);
In jQuery, you can also dynamically load content and be notified when that content has been loaded using the .load() method like this:
$( "#result" ).load( "ajax/test.html", function() {
alert( "Load was performed." );
});
Internally, this just does an ajax call to fetch the data and then calls the callback after the data has been retrieved by ajax and then inserted into the document. It isn't a native event.
If you have some code that is dynamically loading elements in to the DOM and you want to know when those DOM elements are present, then the best way to know when they are ready is to have the code that adds them to the DOM create some sort of event to tell you when it's ready. This prevents battery wasting polling efforts trying to find out if the element is now in the DOM.
It is also possible to use the DOM MutationObserver to see when specific types of changes have been made to the DOM.
这篇关于元素上的jQuery.ready（）等效事件监听器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！