[ JavaScript ] 자바스크립트 기본 문법 | Node 객체(childNodes, firstChild, lastChild, nextSibling...)
·
Archive/Develop
해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: Node 객체 소개 Node 객체는 DOM에서 시조와 같은 역할을 합니다. 다시 말해서 모든 DOM 객체는 Node 객체를 상속 받습니다. Node 객체의 위상을 그림으로 나타내면 아래와 같습니다. 주요 기능 Node 객체의 주요한 임무는 아래와 같습니다. 관계 엘리먼트는 서로 부모, 자식, 혹은 형제자매 관계로 연결되어 있습니다. 각각의 Node가 다른 Node와 연결된 정보를 보여주는 API를 통해서 문서를 프로그래밍적으로 탐색할 수 있게 됩니다. Node.childNodes Node.firstChild Node.lastChild Node.nextSibling Node...
[ JavaScript ] 자바스크립트 기본 문법 | jQuery api 범위 제한 | jQuery find()
·
Archive/Develop
해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: jQuery 조회 범위 제한 이전 포스팅에서 Element 객체에서 getElementsBy* 메소드를 실행하면 조회의 범위가 그 객체의 하위 엘리먼트로 제한된다는 것을 알아봤었습니다. jQuery에서는 어떻게 이러한 작업을 할 수 있을까요? selector context 가장 간편한 방법은 조회할 때 조회 범위를 제한하는 것입니다. 그 제한된 범위를 jQuery에서는 selector context라고 합니다. html css JavaScript JavaScript Core DOM BOM 선택자를 아래와 같이 작성해도 결과는 동일합니다. $( "#active .marked"..
[ JavaScript ] 자바스크립트 기본 문법 | jQuery 속성 제어 API | attr , prop 차이
·
Archive/Develop
해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: jQuery 속성 제어 API 여태껏 포스팅 했던 Element 의 API 에 해당하는 기능이, jQuery에서는 어떻게 구사하는지에 대해서 알아보도록 하겠습니다. 속성제어 jQuery 객체의 메소드 중 setAttribute, getAttribute에 대응되는 메소드는 attr입니다. 또한 removeAttribute에 대응되는 메소드로는 removeAttr이 있습니다. opentutorials 위 그림과 같이 href 속성이 제대로 출력되는 것을 알 수 있습니다. attribute와 property DOM과 마찬가지로 jQuery도 속성(attribute)과 프로퍼티를 ..
[ JavaScript ] 자바스크립트 기본 문법 | 속성 API | Element.*Attribute(getAttribute,setAttribute...)
·
Archive/Develop
해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: 속성 API 속성은 HTML에서 태그명만으로는 부족한 것을 채워주는 부가적인 정보라고 할 수 있습니다. 이 속성을 어떻게 제어하는지에 대해 알아봅시다. 속성을 제어하는 API는 아래 리스트와 같습니다. Element.getAttribute(name) Element.setAttribute(name, value) Element.hasAttribute(name); Element.removeAttribute(name); 각각의 기능은 이름을 통해서 충분히 유추할 수 있을 것 같지만, 다시 설명 드리자면 Element.getAttribute(name) 는 name 이라는 이름을 가진..