어떤 코드도 없이 자바스크립트가 실행되는 경우 자바스크립트는 어떤 코드가 없어도 3가지 변수를 초기화하게 된다. this 변수들(Variavble Object) Scope chain this 경우는 코드가 실행되는 환경의 시점 만약에 console.log(this)가 실행된다면 this는 window객체를 가리키고 나머지 값은 빈 값을 가리키게 된다. 정리 : 자바스크립트 엔진은 코드가 없어도 실행환경(실행 컨텍스트 Execution Context)을 초기화한다. 스코프Scope)는 코드가 현재 실행되는 환경, 맥락(context)을 의미한다. this 포인터, 스코프에 저장된 변수들, 스코프 체인 등이 환경에 포함된다. this 포인터(레퍼런스 변수)의 경우, 글로벌 스코프에서는 window를 가리킨다..
분류 전체보기
제이쿼리 간단한 명령어로 주요 기능을 쉽게 구현할 수 있도록 도와주는 자바스크립트언어로 구성된 라이브러리이다. 자바스크립트와 제이쿼리 비교 JS var str1 = document.getElementById("title"); jQuery $("#title") 제이쿼리 선택자 종류 CSS 선택자 : h1, #title, .article 제이쿼리 선택자 : $("h1"), $("#title"), $(".article") 제이쿼리 이벤트 $("h1").click(function(){.........}); $("h1").fadeln(function(){...........}); $("h1").slideDown(function(){...........}); Mouse 이벤트 $("h1").mouseenter(....
이벤트(Event) 이벤트(Event) : 웹 브라우저가 알려주는 HTML 요소에 대한 사건의 발생이다. 자바스크립트는 발생한 이벤트에 반응하여 특정 동작을 수행할 수 있다. 이벤트 타입 발생한 이벤트의 종류이다.(폼, 키보드, 마우스, HTML DOM, Window 객체 등) 마우스 클릭 이벤트 예시 여길 클릭하세요! 이벤트 핸들러 이벤트가 발생했을 때 그 처리를 담당하는 함수이다. 지정된 이벤트가 발생하면, 웹 브라우저는 그 요소에 등록된 이벤트 핸들러를 실행시킨다. //이 함수는 HTML 문서가 로드될 때 실행된다. window.onload = function(){ //아이디가 "text"인 요소를 선택한다. var text = document.getElementById("text"); text.i..
Node 객체 노드(Node)와 노드 트리 노드(Node) : HTML DOM 에서 정보를 저장하는 계층적 단위이다. 노드트리는 노드들의 집합으로, 노드간의 관계를 나타낸다. 자바스크립트에서는 HTML DOM을 이용하여 노드 트리에 포함된 모든 노드에 접근할 수 있다. 노드 간의 관계 노드 트리의 모든 노드는 서로 계층적 관계를 맺고 있다. 루트노드(HTML), HEAD, BODY 이 세 가지의 노드가 있다면 루트노드는 첫 번째 자식인 HEAD와 두 번째 자식인 BODY를 가지고 있다. 즉, HEAD와 BODY의 부모 노드는 루트노드이다. 또한 HEAD와 BODY는 형제 노드 관계이다. 노드의 종류 문서 노드(document node) : HTML 문서 전체를 나타내는 노드이다. 요소 노드(element..
DOM 요소의 선택 HTML 요소를 선택하기 var selectedItem = document.getElementByTagName("li"); 아이디가 "id"인 요소를 선택하기 var selectedItem = document.getElementById("id"); 클래스가 "odd"인 모든 요소를 선택하기 var selectedItem = document.getElementByClassName("odd") name 속성값이 "first" 인 모든 요소를 선택하기 var selectedItem = document.detElementByName("first"); DOM 요소의 스타일 변경 아이디가 "even"인 요소를 선택하기 var selectedItem = document.getElementById(..
