js 및 jquery를 사용하여 이미지 자동 로딩을 구현하는 방법(코드 첨부)-JS 튜토리얼-php.cn

js 및 jquery를 사용하여 이미지 자동 로딩을 구현하는 방법(코드 첨부)

php中世界最好的语言

풀어 주다： 2018-04-14 13:59:35

원래의

1653명이 탐색했습니다.

이번에는 js 및 jquery(코드 포함)를 사용하여 이미지 자동 로딩을 구현하는 방법을 보여 드리겠습니다. js 및 jquery를 사용하여 이미지 자동 로딩을 구현하는 경우 주의 사항은 무엇입니까? .

JavaScript자동 로딩

①텍스트에 onload 사용: 페이지의 모든 콘텐츠(이미지 포함)가 로드된 후 다음과 같이 onload를 실행합니다.

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

로그인 후 복사

②스크립트에서 window.onload 사용: 페이지의 모든 콘텐츠(이미지 포함)가 로드된 후 다음과 같이 window.onload를 실행합니다.

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. jQuery 자동 로딩

①페이지의 DOM 구조(이미지 제외)를 로드한 후 실행할 때(DOM 요소와 관련된 것들이 로드되지 않았을 수 있음) 다음과 같이 세 가지 방법으로 작성하는 방법이 있습니다.

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

로그인 후 복사

② 다음과 같이 페이지 내 모든 요소(이미지 포함)가 로딩된 후에만 실행합니다.

rreee

③익명 기능을 즉시 실행합니다. 익명 함수를 괄호로 묶은 후 괄호를 사용하면 익명 함수를 즉시 실행할 수 있습니다. 작성 방법은 다음과 같이 두 가지가 있습니다.

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

로그인 후 복사

이 글의 사례를 읽으신 후 해당 방법을 마스터하셨으리라 믿습니다. . 더 흥미로운 정보를 보시려면 PHP 중국어 웹사이트에 들러주세요!

Php8, 나도 갈게

30분 안에 웹사이트 레이아웃 배우기

Shangguan Oracle 초보자부터 능숙한 비디오 튜토리얼까지

UNI-APP 코드의 첫 번째 줄

처음부터 앱 실행까지 Flutter

Lian 형제 새 Linux 비디오 튜토리얼

AXURE 9 비디오 튜토리얼(제품 관리자 대화형 제품 디자인 UI에 적합)

Zero 기본 숙련도 PS 비디오 튜토리얼

시작하는 데 도움이 되는 16일 UI 비디오 튜토리얼

PS 기술 및 슬라이싱 기술 비디오 튜토리얼

Alibaba Cloud 환경 구축 및 프로젝트 출시 비디오 튜토리얼

컴퓨터 네트워크 개요 - 프로그래머가 마스터해야 하는 기본 지식

프로그래머를 위한 필수 튜토리얼 - HTTP 프로토콜 설명

웹소켓 비디오 튜토리얼

js 및 jquery를 사용하여 이미지 자동 로딩을 구현하는 방법(코드 첨부)