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

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

DDD
Libérer: 2024-11-05 01:33:02
original
460 Les gens l'ont consulté

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.
    }
}
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal