웹 프런트 엔드 기준 (10) : 자바 스크립트 (D)

의사 배열 인수

인수를 대신 인수는. 장소에 대한 특정이있다 : 인수는 함수에서만 사용.

1.1 반환 매개 변수의 수

반환 함수 인수 번호 :에서 arguments.length

예를 들면 :

FN (2,4 ), 
FN ( 2,4,6 ), 
FN ( 2,4,6,8 ) 

함수 FN (A, B, C) { 
    CONSOLE.LOG (인수) 
    CONSOLE.LOG (FN. 길이);          // 매개 변수의 수를 가져 
    을 console.log합니다 (에서 arguments.length를);   // 인수의 수를 취득 

    합니다 (CONSOLE.LOG을 "----------------" ) 
}

결과 :

 

 

1.2 만 변경할 수 요소는 지속 기간을 수정할 수없는 

인수 요소를 수정할 수 있지만, 배열의 길이를 변경할 수 있기 때문에 그 이유는 왜, 의사 배열 인수입니다.

예를 들면 :

FN (2,4 ), 
FN ( 2,4,6 ), 
FN ( 2,4,6,8 ) 

함수 FN (A, B) { 
    인수 [ 0] = 99;   // 의 첫번째 인수 번호 99 
    arguments.push (8.);   // 이 방법은 통과하지 않는 요소가 있기 때문에 증가 될 수 없다 
}

여러 가지 방법으로 빈 배열 :

VAR의 배열 = [1,2,3,4,5,6 ] 

Array.splice ( 0);       // 실시 예 1 : 모든 항목이 삭제 
사항 Array.length = 0 일;      // 실시 예 1 : 길이 속성이 지정 될 수 있고, 다른 언어로 읽기 길이입니다 
배열 = [];            //이 모드 3 : 권장

2. DOM 작동 시간

자바 스크립트 2.1 조성물

자바 스크립트는 세 가지 기본 부분으로 나누어 져 있습니다 :

ECMAScript를 : 자바 스크립트 구문 표준. IF 문, 문 등을위한 변수, 표현식, 연산자, 함수를 포함합니다.

DOM : API 문서 객체 모델 페이지의 운영 요소. 이러한 박스 이동 등에도 색 회전을 만드는 등.

BOM : 브라우저 객체 모델, 브라우저 API의 일부 기능을 작동. 예를 들어, 브라우저가 자동으로 스크롤 할 수 있습니다.

2.2 이벤트

JS는 언어의 이벤트 기반 코어이다.

사물의 2.2.1 세 가지 요소

이벤트의 세 가지 요소 : 이벤트 소스, 이벤트, 이벤트 기반 프로그래밍.

예를 들어, 조명을 전환 할 내 손을 누릅니다. 이벤트 소스는이 문제 : 손. 이벤트는 다음과 같습니다 눌러 스위치를. 이벤트 기반 프로그램은 다음과 같습니다 켜기 및 끄기 등.

또 다른 예를 들어, 페이지에 팝업 광고, 나는 오른쪽 상단을 클릭 X종료 아래 광고. 이 점은, 이벤트 소스는 다음과 같습니다 X. 이벤트 : 온 클릭. 이벤트 기반 프로그램은 다음과 같습니다 광고 마감했다.

그래서 우리는 결론을 내릴 수있다 : 이벤트 소스 후속 이벤트로 인해 발생 누가.

다음과 같이 요약 :

이벤트 원본 : html 태그 후속 이벤트를 트리거.

이벤트 : 정의 js've (아래 참조).

이벤트 기반 프로그래밍 : 스타일과 HTML의 작동. 즉 DOM이다.

코드를 다음과 같이 작성 :

이벤트 소스 취득 (1) : document.getElementById를 ( "박스"); // IOS 유사한 언어 adBtn있는 UIButton * = [있는 UIButton buttonWithType : UIButtonTypeCustom];

(2) 이벤트 바인딩 이벤트 소스 이벤트 상자의 onclick = 함수 () {} 드라이버 이벤트 ;.

(3) 쓰기 이벤트 기반 프로그래밍은 다음 DOM에서 작동

코드 예 :

<body>는 
<div ID = "BOX1은"> </ div> 

<script 타입 = "텍스트 / 자바 스크립트"> // 1 이벤트 소스 얻었다. VAR DIV = document.getElementById를 ( "BOX1" );
     // 2 바운드 이벤트 
    div.onclick = 함수 () {
         // 3, 쓰기 이벤트 구동. 
        경고 ( "I 콘텐츠 팝업" ); 
    } </ 스크립트> 
</ BODY>
    
    

다음과 같이 일반적인 이벤트는 다음과 같습니다

 

 

이 이벤트의 다음과 같은 세 가지 요소를 들어, 우리가 소개되었다.

이벤트 소스를 얻기 위해 2.2.2 방법 (DOM을 얻기 위해 노드)

다음과 같이 이벤트를 공통 소스를 가져 오기 :

VAR DIV1 = document.getElementById를 ( "BOX1");       // 방법 : 하나의 태그 ID를 취득하여 
 
VAR arr1 = document.getElementsByTagName ( "DIV1")의 단계;      // 번째 방법 : 태그 어레이 태그 이름에 의해 얻어진 때문에 S의 존재 
 
VAR = document.getElementsByClassName arr2 ( "흐흐")이고;   // 세 가지 방법 : 클래스 이름 얻어진 라벨의 배열이 매우이야

2.2.3 바인딩 이벤트 방법

모드 1 : 직접 익명 함수를 바인딩

<div 언급 ID 상술 = "BOX1"> </ div> 

<타입 = "텍스트 / 자바"의 스크립트> VAR div1 = document.getElementById를 ( "BOX1" );
     // 귀속 이벤트 첫번째 방법이다 
    div1.onclick = 함수 ( ) { 
        경고 ( "나는 내용을 팝업" ); 
    } </ SCRIPT>
    

실시 예 2 : 단일 제 정의 함수 다음 바인딩

<DIV 언급 된 ID 위 = "BOX1"> </ DIV> 

<유형 = "텍스트 / 자바 스크립트"의 스크립트> var에 div1 = document.getElementById를 ( "BOX1" );
     // 바인딩 두 번째 방법은 이벤트 
    div1.onclick = FN;    // 이것이 참고 FN하지 FN (). FN ()는 리턴 값을 말한다. // 개별 기능 정의 함수 FN () { 
        경보 ( "I 콘텐츠 팝업" ); 
    } </ script>
    
    
    

위의 코드 주석 있습니다. 쓰기 FN에 바인딩 할 때, FN 기록하지 (). 주제 전체 기능 FN 및 FN ()는 리턴 값을 나타낸다.

모드 3 : 인라인 바인딩

<! - 인라인 바인딩 -> 
<div 언급 된 ID 위 = "BOX1"onclick을 = "에서 Fn ()"> </ DIV> 

<유형 = "텍스트 / 자바 스크립트"스크립트의> 기능 에서 Fn () { 
        경고 ( "나는 팝 해요 내용 " ); 
    } </ SCRIPT>

    

코드의 첫 번째 줄, 기록 된 바인딩 때 참고 "fn()", 기록되지 "fn". 이 코드는 JS 코드를 작성 바인딩되지 않지만, 문자열을 인식되었다 때문입니다.

2.2.4 이벤트 구동 프로그램

우리는 경고, 우리는 또한 스타일 태그와 속성을 조작 할 수 있습니다뿐만 아니라, 위의 예를 취할 수 있습니다.

예를 들면 다음과 같습니다 :

<스타일> 
        #box { 
            폭 : 100 픽셀, 
            높이 : 100 픽셀, 
            배경 - 색상 : 핑크; 
            커서 : 포인터; 
        }
     </ 스타일> 
</ head> 

<body> 

<DIV ID = "상자"> </ DIV> 

<스크립트 = 유형의 "텍스트 / 자바 스크립트"> var에 oDiv = document.getElementById를 ( "박스" );
     // 마우스를 클릭, 원래 분홍색 DIV 더 큰, 배경 회전 붉은 
    oDiv.onclick = 함수 () { 
        oDiv.style는. 너비 = "200 픽셀";    // 속성 값 인용 쓰기 
        oDiv.style.height = "200 픽셀" ; 
        oDiv.style.backgroundColor = "빨강";   
    // 속성 이름의 backgroundColor입니다 아닌 backgroundColor로 
    }
 </ SCRIPT>

코드 참고 위 :

쓰기 속성은 레인 JS 따옴표를 사용 값 때

쓰기 속성 이름 JS 레인은 backgroundColorCSS의 내부 없습니다 background-Color. CSS 속성 같은 모든 텍스트 기억 - *를, 라인 - *, backgroun- * 등 JS 혹에 기록 된

2.2.5 onload 이벤트

페이지가로드 (텍스트 및 사진)이 완료되면, 트리거 이벤트를 온로드.

예를 들면 :

<스크립트 유형 = "텍스트 / 자바 스크립트"> 
    위해 window.onload = 함수 () { 
        을 console.log ( "미스터 마");   // 등시성 페이지가로드, 인쇄 문자열 
    }
 </ SCRIPT>

한 가지 우리가 알 필요가 : JS 및 HTML 로딩로드 동기화됩니다. 따라서, 정의 요소, 쉬운 오류 전에 요소 경우. 이 시간, 온로드 이벤트 우리는 온로드의 내부에있는 코드의 요소를 사용하여, 편리하게 올 수 있습니다, 우리는이 코드가 마지막으로 실행됩니다 보장 할 수 있습니다.

조언 : 페이지가 완성 된 모든로드 JS 내용의 구현의 요소를 가지고 가로 질러. 그래서, 창로드는 라벨을 정의하기 전에 태그를 사용하여 방지 할 수있다.

추천

출처www.cnblogs.com/liuhui0308/p/11882541.html