Maison > Article > interface Web > Comment implémenter le chargement automatique des images avec js et jquery (code ci-joint)

Comment implémenter le chargement automatique des images avec js et jquery (code ci-joint)

php中世界最好的语言original: 2018-04-14 13:59:351651parcourir

Cette fois, je vais vous montrer comment implémenter le chargement automatique des images avec js et jquery (avec code). Quelles sont les précautions pour le chargement automatique des images avec js et jquery). . Voici le combat réel. Jetons un coup d’œil au cas.

1. JavaScriptChargement automatique

① Utiliser onload dans le texte : exécutez onload une fois que tout le contenu (y compris les images) de la page a été chargé, comme suit :

<body onload="alert(1)"></body>          <!-- 当有一个onload -->
<body onload="alert(2);alert(3);alert(4)"></body> <!-- 当有多个onload用分号隔开,依次弹出 2 3 4 -->

②Utilisez window.onload dans le script : exécutez window.onload une fois que tout le contenu de la page (y compris les images) a été chargé, comme suit :

window.onload = function(){...}; //正确写法，这是匿名函数
//------------↓多个window.onload的错误写法-------------
window.onload = function(){alert("text1");}; //不执行
window.onload = function(){alert("text2");}; //执行
//------------↑---------------------------------------
//------------↓多个window.onload的正确写法---------------------------
window.attachEvent("onload",function(){alert('a')});
window.attachEvent("onload",function(){alert('b')});
window.attachEvent("onload",function(){alert('c')});
//重点提示：在IE浏览器下用 (window.attachEvent)，会弹出 c b a 
//重点提示：其他浏览器下用 (window.addEventListener)，会弹出 a b c
//------------↑-----------------------------------------------------

2. Chargement automatique jQuery

①Exécuter après le chargement de la structure DOM (à l'exclusion des images) dans la page (peut-être que les éléments associés aux éléments DOM n'ont pas été chargés). Il existe trois façons de l'écrire, comme suit :

$(document).ready(function(){...});//写法1，全称 
$(function(){...});        //写法2，简写 
jQuery(function($){...});     //写法3，简写

. ② Exécutez uniquement une fois que tous les éléments de la page (y compris les images) sont chargés, comme suit.

$(window).load(function() {...}); //等于JavaScript的写法，如window.onload = function(){...};

③Exécutez immédiatement la fonction anonyme. Lorsqu'une fonction anonyme est mise entre parenthèses puis suivie de parenthèses, la fonction anonyme peut être exécutée immédiatement. Il existe deux façons de l'écrire, comme suit :

(function(){...})();    //写法1，不加参数
(function($){...})(jQuery); //写法2，加参数，避免与其他变量发生冲突

Je crois que vous l'avez maîtrisée après lecture. C'est le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

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!

php JavaScript jquery JS dom

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

Article précédent：Explication détaillée de l'utilisation du fichier de configuration dev-server.js de l'échafaudage vue-cliArticle suivant：Explication détaillée de l'utilisation du fichier de configuration dev-server.js de l'échafaudage vue-cli

Articles Liés

Voir plus