[JS] dot 연산자로 html 요소 접근하기

Question

자바스크립트 혼자 공부할 때 교재에서는 자바스크립트 내부에서 객체 생성하고 속성이나 메서드 접근 할 때 dot 연산자를 쓴 거는 봤는데, html 요소에 접근 할 때는 getElementsByXXX나 querySelector로 접근하는 것 밖에 못 봤는데, 오늘 학원 수업 시간에 dot 연산자로 접근하는 것을 보고 어떤 경우에 쓸 수 있는 지를 찾아보려 하는데 못찾겠어요..질문특정 태그(요소) 들만 name 값으로 dot 연산자를 사용해서 접근이 가능한 건가요?body태그 하위 요소들 중 최상위 요소에서부터 하나하나 접근해야 사용 가능한 건가요?관련되서 강사님께 질문을 하니, p태그나 div 태그 같은 것들은 객체가 아니라고 하는데 맞는건가요?(dom트리 같은 것을 보면 p, div도 요소노드로 되어있는데... 요소노드가 객체 아닌가요?)document.calc.inbox.value에서 document를 빼도 되던데 이런 경우에는 window.document.가 생략된거라고 봐야하나요?아래는 수업시간에 사용한 코드입니다. Document

doooss · Accepted Answer

1.form 태그는 예외적으로 name 으로 document 에 등록되는 태그 입니다. 다만 여러가지 중복 가능성이 있기 떄문에 document.forms[formName] 을 사용하는 것을 권장드립니다. 4. js 의 좀 자유성이 지나친 점 중 하나 입니다. HTML 파일에서 form name 을 사용하거나, 다른 태그는 id 를 사용한 경우 전역변수로 같이 등록됩니다. (즉, document.getElemenetById(id)로 접근이 아닌 id 로 dom 접근이 가능합니다...) 다만 form name와 마찬가지로, 충돌 가능성이 매우 큰 행위이기때문에 전역변수를 사용하는 것은 기피 패턴 중 하나입니다.

[JS] dot 연산자로 html 요소 접근하기

1개의 답변

기타 목록