Maison > interface Web > js tutoriel > 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中世界最好的语言
Libérer: 2018-04-14 13:59:35
original
1676 Les gens l'ont consulté

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

②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
//------------↑-----------------------------------------------------
Copier après la connexion

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,简写
Copier après la connexion

. ② 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(){...};
Copier après la connexion

③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,加参数,避免与其他变量发生冲突
Copier après la connexion

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!

Étiquettes associées:
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