스피커 1 : 자, 마지막 예에서 우리는 몇 가지를 산재 리콜 내 HTML 내부에 자바 스크립트 코드, 구체적으로는, 값의 내부 제출에라는 속성 해당 양식 태그. 이제 작은 페이지에 대한이 그렇게 큰 문제가 아니다. 그러나, 웹 페이지는 더 길고수록 복잡한, 단순히 퍼팅 당신의 내부 여기 저기에 자바 스크립트 코드 속성 값이없고 건 최고의 디자인. 베스트 우리는을 인수 분해하고있는 경우 최소한의 안쪽에 넣어 중앙 스크립트 태그. 

이 작업을 수행하는 방법을? 음의 내 폼 태그로 복귀하자 먼저이 속성과 삭제 모두 평가한다. 그럼 여기까지, 대신은을 정의 인사라는 함수의가 걸어 보자 코드 줄이 궁극적으로 우리 여전히 실행하고 교체 할 것 다음과 같이 인사 기능. Document.get 요소 ID 맺다 데모를 인용 - 데모, 리콜, 독특한입니다 폼 자체에 대한 식별자 - 점의 이름입니다 기억 제출 이벤트 처리기의 한 우리가 관심. 그리고의 핸들러를 제출하는에 할당 할 수 실제의 값 자체 기능을 수행합니다. 

지금은 사실이 아니에요 통지 여기에 함수를 호출. 내가 대신 익명을 정의하고있어, 그렇지 않으면 람다 함수로 알려진, 이러한 중괄호 사이에 지정하여 코드의 무리가해야 실제로 실행 될 수있다. 특히, 내가 좋아하는 것 코드 실행을하면 내가 가진 그 라인 전에 다음의 그에 추가 할 수 이 양식이되지 않도록 false를 반환 궁극적으로 원격 웹을 종료 제출 전통적인 방법으로 서버. 

의 지금,이 파일을 저장하고, 그것을 열어 보자 브라우저에서, 무슨 일이 일어 나는지 참조하십시오. http://localhost/dom-1.html. 의 지금은 내 이름을 입력하자 다윗은, 제출. 그리고 아무 일도 것으로 나타납니다 내 페이지의 URL는 것 제외 형태가 된 것처럼 변경 실제로 같은 파일을 제출했다. 

이제 그 이유가 될 수 있을까요? 그럼 난 좀 더 많은 정보가 필요합니다. 그래서 앞서 가자와 크롬의를 열어 개발자 도구 있도록 사실 수 있습니다 볼 콘솔 창을보고 내가 뭔가 잘못했을 경우. 나는 통해 그 액세스 할 수 있습니다 몇 가지 방법. 중 하나는, 여기에이 메뉴를 통해입니다 다음 도구에서 다음 아래로 개발자 도구. 

그리고, 여기에 콘솔 탭에서 예고 캐치되지 않는 유형의 오류가 아닌 수는있다 널 (null)의 제출에 대한 속성을 설정합니다. 이제 그 이유가 될 수 있을까요? 그럼 다시 내 소스 코드는 여기에 통지 그에 나는 생각 제출 요소의 속성 고유 식별자는 데모입니다. 요소는, 다시, 단지이다 트리에서 노드. 

그래서 내 브라우저는하지 않는 것으로 나타 생각하는 요소 또는 노드가 아직 존재합니다. 그리고 실제로, 그것은하지 않습니다. 웹 페이지를 구문 분석 할 것을 기억 또는 읽기 웹 브라우저로, 위에서 아래로, 왼쪽에서 오른쪽으로. 그리고 때 자바 스크립트 코드는 발생 전형적 그것을 실행있어 바로. 

그러나이 경우, 우리는 심지어 못 했어 아직 DOM의 부분에, 독특한로 해당 양식 HTML, 식별자 데모를 선언하고있다. 그래서 우리는 실행하려는 내 해당 노드 전에 자바 스크립트 코드도 물론입니다 트리에 존재 문제가, 다음, 반드시 때문에 요소 자체가 null이됩니다 그 시점에서. 

어떻게 문제를 해결하려면? 그럼 우리는 몇 가지 해결책이있다. 그러나의 재배치하여 간단한 해보자 머리에서 내 스크립트 태그 으로, 특히 내 몸에 태그를하지만, 내 페이지의 몸의 아래쪽 때문에 그것은 노드 이하의 것을 질문. 특히,의 강조하자 잘라 열린 태그와 스크립트 닫기 태그 코드의 전체 블록을 재배치 여기에 파일의 맨 아래에. 

지금이 반드시 깨끗한 아니다 디자인,하지만 적어도 그것은 것 작업의 올바른 순서를 적용합니다. 의 파일을 저장하자 브라우저에서 다시로드합니다. 의 페이지를 다시로드하자, 다시 입력 내 이름, 거기에, 안녕하세요 데이비드가 돌아왔다.