지역 사회 배우다 도구 라이브러리 여가
찾다
한국어
집 > 웹 프론트엔드 > JS 튜토리얼 > CSS의 js 코드 또는 javascript_javascript 팁을 미리 로드하세요.

CSS의 js 코드 또는 javascript_javascript 팁을 미리 로드하세요.

WBOY
풀어 주다： 2016-05-16 18:28:50
원래의
1103명이 탐색했습니다.

일반적으로 파일을 미리 로드하는 방법에는 xhr과 동적으로 노드를 삽입하는 두 가지 방법이 있습니다. 동적으로 노드를 삽입하는 것은 가장 간단하고 가장 널리 사용되는 비동기 로딩 방법입니다(예: yui의 Get 모듈). 그러면 동적으로 삽입된 노드 메서드를 사용하여 로드된 파일은 로드 후 즉시 실행됩니다. 한편, 자바스크립트 실행은 브라우저의 js를 차지합니다. 반면에 프로세스는 페이지 구조를 변경할 수도 있으며 CSS를 실행하면 전체 페이지가 변경될 가능성이 더 높습니다. xhr 메소드는 동일한 도메인의 제한으로 인해 스크립트를 실행하지 않지만 웹 사이트의 정적 파일은 이제 CDN 서버에 배포되지만 CSS js 파일을 미리 로드하는 방법은 다소 신비해졌습니다.

Stoyan Stefanov는 파일을 실행하지 않고 로드하는 방법을 간결하게 설명합니다. 원본 텍스트는 http://www.phpied.com/preload-cssjavascript-without-execution/

에서 찾을 수 있습니다. 구체적인 방법은 다음에서 new Image().src를 사용하는 것입니다. IE는 파일을 미리 로드하는 반면 다른 브라우저는 동적으로 삽입된 태그를 사용하여 로드를 완료합니다.
코드 일부는 다음과 같습니다

코드 복사 코드는 다음과 같습니다

window.onload = function () {

var i = 0,
max = 0,
o = null,

// 미리 로드할 항목 목록
preload = [
'http://tools.w3clubs.com/pagr2/.sleep.expires.png',
'http://tools .w3clubs.com/pagr2/ .sleep.expires.js',
'http://tools.w3clubs.com/pagr2/.sleep.expires .css'
],
isIE = navigator.appName.indexOf('Microsoft') === 0

for (i = 0, max = preload .length; i < i = 1) {

if (isIE) {
new Image().src =
계속; >o = document.createElement( 'object');
o.data = preload[i];

// IE 항목, 그렇지 않으면 0x0이 괜찮습니다.
//o.width = 1;
//o.height = 1;
//o.style.visibility = "hidden";
//o.type = "text/plain" // IE
o.width = 0;
o .height = 0;

// FF만 헤드에 추가됩니다.
// 다른 모든 항목에는 본문이 필요합니다
document.body.appendChild(o); }
};


데모 이용 가능
http://phpied.com/files/object-prefetch/page1.php?id=1

몇 가지 참고 사항: 1. ff에서 new Image().src를 사용할 수 없는 이유는 ff가 이미지에 대해 별도의 캐시를 구현하기 때문입니다. 동시에 사파리와 크롬은 캐시되지 않는 것 같습니다.

2. 동적으로 삽입된 객체 태그를 헤드가 아닌 부분에 삽입해야 로드가 실행됩니다.

3. ie7 ie8은 동적 개체를 사용하여 일부 코드(코드 주석에 언급됨)를 통해 파일을 로드할 수도 있습니다. 하지만 저자는 그 물건이 대개 돈을 많이 소모한다는 사실을 발견했습니다.


직접 실험을 통해 도움이 필요한 학생들이 시도해 볼 수도 있다는 것을 알게 되었습니다. .
관련 라벨：
css javascript 예압
원천：php.cn
이전 기사：JavaScript 객체 체인 동작 테스트 code_js 객체지향 다음 기사：다운로드 website_javascript 스킬에서 페이지를 연 후 다운로드 링크 주소 코드가 표시되기까지 얼마나 걸리나요?
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
Javascript/Jquery를 사용하여 버튼 없이 양식 제출 JavaScript 함수를 호출하고 JQUERY/PHP를 사용하여 양식을 실행하여 버튼 없이 양식을 제출하려고 합니다. 페이지를 다시 로드하지 않고 백엔드에서 양...
에서 2024-04-06 14:54:03
0
2
421
ASP 클래식 코드를 MYSQL 데이터베이스에 문자열로 저장할 가능성 ASP 클래식 코드를 MySQL 데이터베이스에 저장하고 끌어올 때 코드를 실행하도록 할 수 있습니까? 예를 들어 변수 이름을 문자열에 저장하고 표시하기 전에 AS...
에서 2024-04-06 13:38:43
0
1
358
Live Server를 사용하는 웹 사이트를 파일에서 실행할 때 작동하지 않습니다. 여러 브라우저를 사용해 보았지만 모든 경우에 웹사이트가 LiveServer에서 잘 작동했습니다. 반면, Firefox/Chrome을 사용하여 실행하면 사이트에서 ...
에서 2024-04-06 12:46:18
0
1
403
Electron은 사전 로드 시 AppData를 가져옵니다. 사전 로드된 AppData 디렉터리를 얻는 방법은 무엇입니까? Background.js[...]asyncfunctioncreateWindow(){constwin=...
에서 2024-04-06 11:05:31
0
1
417
엑스포에서 글꼴을 로드할 수 없습니다 Expo에서 글꼴을 로드하려고 시도했지만 계속 같은 오류가 발생합니다. 내 코드는 다음과 같습니다. 내 Index.js는 다음과 같습니다. importWelcom...
에서 2024-04-05 15:18:52
0
1
3611
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿