분류 전체보기46 DOM과접근법 ✅ DOM (Document Object Modeal) DOM 은 문서객체 모델로 HTMl의 각 요소들을 트리형태로 구성해준다. 개발자들은 JavaScript를 이용해서 이를 생성하거나 수정하거나 삭제할 수 있다. DOM을 그림으로 표현하면 아래 그림 처럼 트리형태가 된다. 하나의 객체를 '노드(node)'라고 한다. 위쪽을 부모노드 아래쪽을 자식노드라고 한다. document를 제외하고 최상단에 있는 HTML을 root node 라고 한다. document.documentElement; == HTML ✅ DOM에 접근하기 모든 HTML 태그는 객체이다. 객체는 JavaScript로 접근하고 제어할 수 있다. document.body.style 를 console에 쳤더니 body의 모든 스타일이 .. 2023. 4. 11. 조건문 ✅ 조건문 조건문은 주어진 조건식의 평가 결과에 따라 코드 블록(블록문)의 실행을 결정한다. 조건식은 Boolean 값으로 평가될 수 있는 표현식이다. 🤔 블록문이란? 0개 이상의 문을 중괄호로 묶은 것. 자바스크립트는 블록문을 하나의 실행단위로 취급 📍 if ...else 문 조건식의 평가 결과가 true일 경우 if문의 코드가 실행되고 false일 경우 else문의 코드 블록이 실행된다. let num = 10; if (num < 20) { console.log('true') } else { console.log('false') } // 중괄호 안의 코드가 한 줄이라면 중괄호 생략 가능 if(num < 20) console.log('중괄호 생략') else if 조건식을 추가하여 실행될 코드 블럭을 .. 2023. 4. 6. Object ✅ Object 객체는 여러개의 데이터를 한 변수에 저장할 수 있는 자료형이다. 객체는 {} 중괄호를 사용해 생성하고 키(key) 와 값(value)으로 구성된 프로퍼티(property)를 가지고 있으며 각 프로퍼티는 ,(쉼표)로 구분된다. 또한 key와 value는 콜론(:)으로 구분된다. const human = { name: "taehee", age: 28, from: "korea", askingShe: function () { console.log("hello world!"); }, 0: '01000000000' }; // 추가 human.gender = 'female'; human['hairColor'] = 'black'; // 접근 console.log(human.hairColor); // b.. 2023. 4. 5. Array ✅ Array 배열은 여러 개의 변수를 한 번에 선언해 다룰 수 있는 객체타입으로 순서가 있는 리스트이다. [] 대괄호를 사용해 생성하고 내부의 값을 ,(쉼표)로 구분해 입력해야한다. 배열 안의 값을 요소(element)라고 한다. 또한 배열안에는 문자형, 숫자형, 불린형 심지어 객체, 함수 까지 포함할 수 있다. const fruit = ['apple', 'banna', 'orange']; const num = [10, 20, 30]; ✅ 배열 요소에 접근 📍 arr[ index ] 배열의 요소들은 앞에서부터 순서대로 고유 번호가 부여되는데 이를 인덱스(index) 라고 부른다. 순서를 호출 하는것은 인덱싱(indexing) 이라고 하며 인덱스는 0 부터 시작하게 되고 배열을 탐색할때 사용하게 된다. .. 2023. 4. 5. 이전 1 2 3 4 5 6 ··· 12 다음
