오늘의 티!아이!엘!!

Dom을 통한 유효성 검사

Dom을 통하여 HTML을 조작한다..
Documet Object Model의 약자로,
HTML요소를 Objectc처럼 조작을 할 수 있는 Model이다

이것은 또 무슨말인고하니..자바스크립트를 배우고, 그것을 통해 궁극적으로,
웹을 제작하고 또 동적으로 동작하게 해야하니

그 동적인 움직임을 위하여 HTML을 제어할 수 있다는것이다..
앞으로의 웹 개발자로서 아주 중요한 부분일 것같다.

Dom을 조작하면서 많이 쓰이는 것들을 간단히 정리해보자

console.log와 console.dir의 차이

• console.log
  - 인자로 전달된 값을 출력

  • 요소를 HTML과 같은 트리 구조로 출력

• console.dir
  - 인자로 전달된 객체의 속성을 출력

  • 요소를 json과 같은 트리 구조로 출력

js태그의 위치

• head에 추가하면 파일이 클 경우에는 랜더링이 너무 오래 걸릴 수 있고,
  로드가 되지 않았는데, 실행이 될 수도 있다.
  

innerhtml / textcontent

• innerhtml은 문자열로 입력한 태그도 태그로 인식되어 오류가 날 수 있다.
  보안적 문제도 일어날 수 있으니.. 가급적 textcontent사용..

함수로 쪼개는 것이 왜 좋은것인가..

• 같은 것을 다시 반복하지 않아도되고,
  사이드 이펙트를 방지할 수 있으며,
  에러를 찾기에도 용이하다.

이벤트 객체

• 이벤트 객체는 매개변수 하나만 가능

온클릭

• 온이벤트 하나에 이벤트 하나만 가능

addeventlister

• 이벤트를 오버라이트 할 수 있다.
  여러 개의 핸들러를 넣을 수 있다.