Maison  >  Article  >  interface Web  >  Comment obtenir la fonctionnalité de $(document).ready() sans jQuery ?

Comment obtenir la fonctionnalité de $(document).ready() sans jQuery ?

DDD
DDDoriginal
2024-11-05 01:33:02432parcourir

How to Achieve the Functionality of $(document).ready() Without jQuery?

Équivalent non jQuery de $(document).ready()**

La fonction $(document).ready() dans jQuery est couramment utilisé pour exécuter du code une fois le DOM complètement chargé. Cependant, il existe des situations dans lesquelles l'utilisation de jQuery peut ne pas être souhaitable ou disponible. Dans de tels cas, un équivalent non-jQuery est nécessaire.

Answer

L'équivalent non-jQuery de $(document).ready() est document.addEventListener( "DOMContentLoaded", fonction() { ... }). Cette fonction attache un écouteur d'événement à l'événement DOMContentLoaded, qui est déclenché lorsque l'arborescence DOM est entièrement construite. Le code placé à l'intérieur de l'écouteur d'événement sera exécuté une fois le DOM prêt.

Différences par rapport à window.onload

Notez que window.onload n'est pas la même chose que $( document).ready(). window.onload attend uniquement que tous les éléments soient complètement chargés, y compris les ressources externes telles que les images et les scripts. En revanche, $(document).ready() n'attend que que l'arborescence DOM soit prête, ce qui est généralement plus rapide.

Support IE8 et versions antérieures

Pour les navigateurs plus ancien que IE8, une alternative à DOMContentLoaded consiste à utiliser document.onreadystatechange avec la condition suivante :

document.onreadystatechange = function () {
    if (document.readyState == "interactive") {
        // Initialize your application or run some code.
    }
}

Autres options

En plus de DOMContentLoaded, il existe d'autres écouteurs d'événements qui peut être utilisé pour gérer le chargement du DOM. Pour plus de détails, consultez la documentation de Mozilla Developer Network (MDN).

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn