자바스크립트 지연 로딩 구현 방법

구현 방법: 1. setTimeout 메서드를 사용합니다. 구문은 "setTimeout('js method', Delay time);"입니다. 2. 외부 js 스크립트 파일을 도입할 때 본문에 넣으면 로드됩니다. 페이지에 따라 위에서 아래로 JavaScript 코드를 순차적으로 실행합니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

js의 지연 로딩은 페이지의 로딩 속도를 향상시키는 데 도움이 됩니다. 다음은 지연 로딩의 여러 방법입니다.

1 로딩 시간을 지연하려면 setTimeout 지연 메서드를 사용하세요.

JS 코드의 레이 로딩을 종료합니다. 웹 페이지 로딩에 더 많은 시간이 걸립니다 멀티타임

<script type="text/javascript" >
  function A(){
    $.post("/lord/login",{name:username,pwd:password},function(){
      alert("Hello");
    });
  }
  $(function (){
    setTimeout(&#39;A()&#39;, 1000); //延迟1秒
  })
</script>

2. js를 마지막에 로드하도록 하세요

예를 들어 외부 js 스크립트 파일을 도입할 때 html의 헤드에 배치하면 js 스크립트가 로드됩니다. 페이지가 로드되기 전에 페이지에 들어가서 본문에 배치하면 페이지 로딩 순서에 따라 JavaScript 코드가 위에서 아래로 실행됩니다 ~~~ 그래서 js 외부에서 가져온 파일을 아래쪽에 넣을 수 있습니다.

위의 방법 2 또한 때때로 Google의 페이지 속도 테스트 도구에서 "자바스크립트 로딩 지연" 경고를 받게 됩니다. 따라서 여기의 솔루션은 Google 도움말 페이지에서 권장되는 솔루션이 될 것입니다.

//这些代码应被放置在</body>标签前(接近HTML文件底部)
<script type="text/javascript">
  function downloadJSAtOnload() {
    var element = document.createElement("script");
    element.src = "defer.js";
    document.body.appendChild(element);
  }
  if (window.addEventListener)
    window.addEventListener("load", downloadJSAtOnload, false);
  else if (window.attachEvent)
    window.attachEvent("onload", downloadJSAtOnload);
  else window.onload = downloadJSAtOnload;
</script>

이 코드는 외부 파일 "defer.js"를 로드하기 전에 전체 문서가 로드될 때까지 기다리라는 의미입니다.

이 코드를 사용하는 단계:

1) 위 코드를 복사합니다.

2) HTML 태그 앞에 코드를 붙여넣습니다(HTML 파일 하단 근처).

3). 외부 JS 파일 이름

4) 파일 경로가 올바른지 확인하세요. 예: "defer.js"만 입력하는 경우 "defer.js" 파일은 HTML 파일과 동일한 폴더에 있어야 합니다.

참고: 이 코드는 문서가 로드될 때까지 지정된 외부 js 파일을 로드하지 않습니다. 따라서 일반적인 페이지 로딩에 의존하는 JavaScript 코드는 여기에 배치하면 안 됩니다. 대신 JavaScript 코드는 두 그룹으로 분리되어야 합니다. 한 그룹은 페이지에 필요하기 때문에 즉시 로드되는 자바스크립트 코드이고, 다른 그룹은 페이지가 로드된 후 작동하는(예: 클릭 이벤트 추가 등) 자바스크립트 코드입니다. 실행되기 전에 페이지가 로드될 때까지 기다려야 하는 JavaScript 코드는 외부 파일에 배치한 다음 가져와야 합니다.

【추천 학습: javascript 고급 튜토리얼】

위 내용은 자바스크립트 지연 로딩 구현 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!