페이지 분석 javascript 순서

하나. http://dancewithnet.com/2007/03/22/order-of-execution-of-javascript-on-web/HTML자바 sript 를 삽입 하 는 방법
자바 script 코드 를 태그 대 < script > 과 < / script > 사이 에 직접 놓 습 니 다 < script / > 표 시 된 src 속성 으로 외부 js 파일 만 들 기 이벤트 처리 프로그램 에 넣 습 니 다. 예 를 들 어 <p onclick="alert(' onclick Javascript')"> </p> URL 의 주체 로 서 이 URL 은 특수 한 자바 script: 프로 토 콜 을 사용 합 니 다. 예 를 들 어 <a href="javascript:alert(' javascript: javascript')"> </a> javascript 자체 의 document. write () 방법 으로 새로운 javascript 코드 쓰기 Ajax 비동기 로 자바 script 코드 를 가 져 와 실행 세 번 째 방법 과 네 번 째 방법 으로 기 록 된 자 바스 크 립 트 는 트리거 를 해 야 실행 할 수 있 기 때문에 특별한 설정 이 없 으 면 페이지 를 불 러 올 때 실행 되 지 않 습 니 다.
2. Javascript 페이지 에서 의 실행 순서
페이지 에 있 는 자 바스 크 립 트 코드 는 HTML 문서 의 일부분 이기 때문에 자 바스 크 립 트 가 페이지 에 불 러 올 때 실행 하 는 순 서 는 태그 < script / > 의 출현 순 서 를 도입 하 는 것 입 니 다. < script / > 태그 에 있 거나 src 를 통 해 도 입 된 외부 JS 는 모두 그 문장 에 나타 난 순서에 따라 실행 되 고 실행 과정 은 문서 가 불 러 오 는 일부분 입 니 다.
모든 스 크 립 트 가 정의 하 는 전역 변수 와 함 수 는 뒤에 실 행 된 스 크 립 트 에 의 해 호출 될 수 있 습 니 다.
변수의 호출 은 앞에서 설명 한 것 이 어야 합 니 다. 그렇지 않 으 면 가 져 온 변수 값 은 undefined 입 니 다.

<script type="text/javscrpt">//<![CDATA[
alert(tmp);  //   undefined
var tmp = 1;
alert(tmp);  //   1
//]]></script>

같은 스 크 립 트 에서 함수 정 의 는 함수 호출 뒤에 나타 날 수 있 지만 각각 두 개의 코드 에 있 고 함수 가 첫 번 째 코드 에 호출 되면 함수 가 정의 되 지 않 은 오 류 를 보고 합 니 다.

<script type="text/javscrpt">//<![CDATA[
aa();            //     
//]]></script>
<script type="text/javscrpt">//<![CDATA[
aa();			//   1 
function aa(){alert(1);}
//]]></script>

document. write () 는 출력 을 스 크 립 트 문서 가 있 는 위치 에 기록 합 니 다. 브 라 우 저 는 document. write () 가 있 는 문서 내용 을 분석 한 후 document. write () 가 출력 한 내용 을 계속 분석 한 다음 HTML 문 서 를 계속 분석 합 니 다.

<script type="text/javascript">//<![CDATA[
    document.write('<script type="text/javascript" src="test.js"><\/script>');
    document.write('<script type="text/javascript">');
    document.write('alert(2);')
    document.write('alert("  " + tmpStr);');
    document.write('<\/script>');
    //]]></script>
  <script type="text/javascript">//<![CDATA[
    alert(3);
    //]]></script>

test. js 의 내용 은:

var tmpStr = 1;
    alert(tmpStr);

Firefox 와 Opera 에서 팝 업 값 의 순 서 는: 1, 2, 저 는 1, 3 입 니 다.
IE 에서 팝 업 값 의 순 서 는 2, 1, 3 이 며, 브 라 우 저 오류: tmpStr 가 정의 되 지 않 았 습 니 다 IE 가 document. write 에 있 을 때 SRC 에 있 는 자 바스 크 립 트 코드 를 불 러 오 기 를 기다 리 지 않 고 다음 줄 을 실 행 했 기 때문에 2 가 먼저 팝 업 되 고 document. write ('document. write' + tmpStr) 에서 tmpStr 를 호출 했 을 때 tmpStr 가 정의 되 지 않 아 오류 가 발생 했 습 니 다.이 문 제 를 해결 하려 면 HTML 분석 을 이용 하여 HTML 라벨 을 분석 하고 다음 원 리 를 실행 하 며 코드 를 나 누 어 실현 할 수 있 습 니 다.

<script type="text/javascript">//<![CDATA[
    document.write('<script type="text/javascript" src="test.js"><\/script>');
    //]]></script>
  <script type="text/javascript">//<![CDATA[
    document.write('<script type="text/javascript">');
    document.write('alert(2);')
    document.write('alert("  " + tmpStr);');
    document.write('<\/script>');
    //]]></script>
  <script type="text/javascript">//<![CDATA[
    alert(3);
    //]]></script>

이렇게 IE 아래 와 다른 브 라 우 저 출력 값 의 순 서 는 계속 되 었 습 니 다. 1, 2, 저 는 1, 3 입 니 다.
3. 페이지 에서 자 바스 크 립 트 의 실행 순 서 를 어떻게 바 꿉 니까?
onload

<script type="text/javascript">//<![CDATA[
window.onload = f;
function f(){alert(1);}
alert(2);
//]]></script>

를 이용 하여 출력 값 순 서 는 2, 1 입 니 다.주의해 야 할 것 은 여러 개의 winodws. onload 가 존재 한다 면 가장 효과 가 있 는 방법 은 다음 과 같다.

window.onload = function(){f();f1();f2();.....}

2 급 DOM 이벤트 유형

if(document.addEventListener){
window.addEventListener('load',f,false);
window.addEventListener('load',f1,false);
...
}else{
window.attachEvent('onload',f);
window.attachEvent('onload',f1);
...
}

IE 에 서 는 defer 를 이용 할 수 있 습 니 다. defer 역할 은 코드 를 불 러 오 는 것 입 니 다. 즉시 실행 되 지 않 습 니 다. 문 서 를 불 러 온 후에 실행 할 수 있 습 니 다. window. onload 와 유사 하지만 window. onload 와 같은 한계 가 없어 서 중복 사용 할 수 있 지만 IE 에서 만 유효 하기 때문에 위의 예 는

<script type="text/javascript">//<![CDATA[
document.write('<script type="text/javascript" src="test.js"><\/script>');
document.write('<script type="text/javascript" defer="defer">');
document.write('alert(2);')
document.write('alert("  " + tmpStr);');
document.write('<\/script>');
//]]></script>
<script type="text/javascript">//<![CDATA[
alert(3);
//]]></script>

로 수정 할 수 있 습 니 다. 그러면 IE 는 잘못 보고 하지 않 습 니 다.출력 값 의 순 서 는 1, 3, 2 로 바 뀌 었 습 니 다. 저 는 1. HTML 해상도 기 가 스 크 립 트 를 만 났 을 때 일반적인 문서 에 대한 분석 을 중지 하고 스 크 립 트 가 실 행 될 때 까지 기 다 려 야 합 니 다.이 문 제 를 해결 하기 위해 HTML 4 표준 은 defer 를 정의 했다.defer 를 통 해 브 라 우 저 에 게 HTML 문 서 를 계속 분석 하고 스 크 립 트 실행 을 지연 시 킬 수 있 음 을 알려 줍 니 다.이 지연 은 스 크 립 트 가 외부 파일 에서 불 러 올 때 매우 유용 합 니 다. 브 라 우 저 는 외부 파일 이 모두 불 러 올 때 까지 기다 리 지 않 고 계속 실행 할 수 있 으 며 성능 을 향상 시 킬 수 있 습 니 다.IE 는 현재 defer 속성 을 지원 하 는 유일한 브 라 우 저 이지 만 IE 는 defer 속성 을 정확하게 실현 하지 못 했 습 니 다. 지연 되 는 스 크 립 트 가 항상 지연 되 기 때문에 문서 가 끝 날 때 까지 다음 지연 되 지 않 는 스 크 립 트 로 만 지연 되 지 않 습 니 다.이것 은 IE 에서 지 연 된 스 크 립 트 의 실행 순서 가 상당히 혼 란 스 럽 고 뒤에 지연 되 지 않 은 스 크 립 트 가 필요 한 함수 와 변 수 를 정의 할 수 없다 는 것 을 의미한다.IE 의 모든 defer 스 크 립 트 실행 시간 은 HTML 문서 트 리 가 만들어 진 후 window. onload 이전 일 것 입 니 다.
아 약 스 를 이용 하 다.xml. httpRequest 는 외부 문서 가 불 러 온 상 태 를 판단 할 수 있 기 때문에 코드 의 불 러 오 는 순 서 를 바 꿀 수 있 습 니 다.