Réponses:
document.ready
est un événement jQuery, il s'exécute lorsque le DOM est prêt, par exemple tous les éléments doivent être trouvés / utilisés, mais pas nécessairement tout le contenu .window.onload
se déclenche plus tard (ou en même temps dans les pires / échecs) lorsque les images et autres sont chargées, donc si vous utilisez des dimensions d'image par exemple, vous souhaiterez souvent l'utiliser à la place.$(window).on('load')
. Les deux référençant l' événement de chargement .
it will run on ALL future calls of the function
?
$(document).ready
code une fois que le DOM est prêt. C'est un si petit cas d'utilisation qu'il ne valait probablement pas la peine de confondre tout le monde avec le mentionner. 2) L'ENVIRONNEMENT n'appelle $(document).ready(function(){})
qu'une seule fois, lorsque le DOM est prêt. Si l'utilisateur, pour une raison quelconque, exécute davantage une $(document).ready
fois que le DOM est prêt, alors oui, il sera exécuté immédiatement.
$(document).ready(function() {
// executes when HTML-Document is loaded and DOM is ready
alert("document is ready");
});
$(window).load(function() {
// executes when complete page is fully loaded, including all frames, objects and images
alert("window is loaded");
});
Le $(window).load()
n'est PAS disponible dans jQuery 3.0
$( window ).load(function() {
// Handler for .load() called.
});
Pour le contourner, vous pouvez l'utiliser comme une "pièce jointe de gestionnaire d'événements"
$( window ).on("load", function() {
// Handler for .load() called.
});
Les différences sont:
$(document).ready(function() {
est un événement jQuery qui est déclenché lorsque le DOM est chargé, il est donc déclenché lorsque la structure du document est prête.
$(window).load()
l'événement est déclenché après le chargement de tout le contenu.
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$( document ).ready(function() {
alert( "document loaded" );
});
$( window ).load(function() {
alert( "window loaded" );
});
</script>
</head>
<body>
<iframe src="http://stackoverflow.com"></iframe>
</body>
</html>
window.load sera déclenché après le chargement de tout le contenu iframe
$(document).ready
se produit lorsque tous les éléments sont présents dans le DOM, mais pas nécessairement tout le contenu.
$(document).ready(function() {
alert("document is ready");
});
window.onload
ou $(window).load()
se produit après que toutes les ressources de contenu (images, etc.) ont été chargées.
$(window).load(function() {
alert("window is loaded");
});
De jquery prospective - il suffit d'ajouter load
/ onload
événement à la fenêtre et au document. Regarde ça:
document.ready (jQuery) document.ready s'exécutera juste après que le document HTML est chargé, et que le DOM soit prêt.
DOM: Le modèle d'objet de document (DOM) est une convention multiplateforme et indépendante du langage pour représenter et interagir avec des objets dans des documents HTML, XHTML et XML.
$(document).ready(function()
{
// executes when HTML-Document is loaded and DOM is ready
alert("(document).ready was called - document is ready!");
});
window.load (JavaScript intégré) Le window.load attendra cependant que la page soit entièrement chargée, cela inclut les cadres internes, les images, etc. * window.load est une méthode JavaScript intégrée, il est connu pour en avoir bizarreries dans les anciens navigateurs (IE6, IE8, anciennes versions FF et Opera) mais fonctionnent généralement dans chacun d'eux.
window.load peut être utilisé dans l'événement onload du corps comme ceci (mais je vous suggère fortement d'éviter de mélanger du code comme celui-ci dans le HTML, car c'est une source de confusion plus tard):
$(window).load(function()
{
// executes when complete page is fully loaded, including all frames, objects and images
alert("(window).load was called - window is loaded!");
});
$ (window) .load est un événement qui se déclenche lorsque le DOM et tout le contenu (tout) de la page est entièrement chargé comme CSS, images et cadres. Un meilleur exemple est si nous voulons obtenir la taille réelle de l'image ou obtenir les détails de tout ce que nous utilisons.
$ (document) .ready () indique que le code qu'il contient doit être exécuté une fois le DOM chargé et prêt à être manipulé par le script. Il n'attendra pas le chargement des images pour exécuter le script jQuery.
<script type = "text/javascript">
//$(window).load was deprecated in 1.8, and removed in jquery 3.0
// $(window).load(function() {
// alert("$(window).load fired");
// });
$(document).ready(function() {
alert("$(document).ready fired");
});
</script>
$ (fenêtre) .load déclenché après $ (document) .ready ().
$ (window) .load a été déprécié en 1.8 et supprimé dans jquery 3.0
Je pense que l' $(window).load
événement n'est pas pris en charge par JQuery 3.x
Selon les événements DOM niveau 2, l' load
événement est censé se déclencher document
, et non pas window
. Cependant, load
est implémenté window
dans tous les navigateurs pour une compatibilité ascendante.
$(document).ready(function(){})
is$(function(){})
et une autre différence importante par rapport à window.load est qu'il s'exécutera sur TOUS les futurs appels de la fonction, même après le DOMready initial.