2) 문자열기반으로 DOM 조작하기 DOM API를 사용해서 node를 생성하고 추가하는 건 복잡한 일입니다. html을 문자열로 처리하면서 dom에 쉽게 추가하는 방법을 알아보겠습니다. 1. DOM 조작 API 아래 API들은 삭제, 추가, 이동, 교체를 위한 API사용법입니다. removeChild(): 노드의 자식노드인 인자 값에 들어 있는 노드를 지운 뒤 반환합니다. ex) node.removeChild(child); appendChild(): 인자 값으로 들어온 노드를 엘리먼트의 마지막 자식 노드로 추가합니다. 반환된 값은 이동한 자식 노드를 의미합니다. ex) element.appendChild(aChild); cf) HTML을 어떤 메서드 기반으로 넣는 게 아니고 문자열 기반의, 문자열 처리..
1) DOM node 생성과 추가 DOM DOM(Document Of Model)은 객체 지향 모델로써 구조화된 문서를 표현하는 형식이다. DOM은 동일한 문서를 표현하고, 저장하고, 조작하는 방법을 제공한다. DOM은 웹 페이지의 객체 지향 표현이며, 자바스크립트와 같은 스크립팅 언어를 이용해 DOM을 수정할 수 있다. W3C DOM, WHATWG DOM 표준은 대부분의 브라우저에서 DOM을 구현하는 기준이다. (출처: https://ko.wikipedia.org/wiki/%EB%AC%B8%EC%84%9C_%EA%B0%9D%EC%B2%B4_%EB%AA%A8%EB%8D%B8 https://developer.mozilla.org/ko/docs/Web/API/Document_Object_Model/%EC%8..
2) 자바스크립트 객체 객체 자바스크립트에서 어떤 데이터를 저장, 보관, 관리, 수정하기 위해서는 배열을 쓰거나 객체 데이터를 사용해야 합니다. 배열은 순서가 있는 리스트이고 객체는 key값을 이용하여 value를 뽑아내는 것입니다. 이름이 있는 데이터를 보관할 떄 쓰일 수 있습니다. key, value 구조의 자료구조입니다. JavaScript로 데이터를 표현하기 위해서는 Array, Object를 사용합니다. Object형태는 {}로 그 자료를 표현하며, 서버와 클라이언트 간에 데이터를 교환할 때 Object포맷과 비슷한 방법으로 데이터를 보냅니다. 자바스크립트 객체는 내부적으로는 어떤 순서(order)를 가지고는 있습니다. 하지만 겉으로 드러나는 index가 아니므로 객체를 순서기반으로 사용하면 안..
1) 자바스크립트 배열 배열의 선언 자바스크립트 배열의 선언은 간단합니다. var a = []; //배열 안에는 모든 타입이 다 들어갈 수 있다. 함수도 배열 안에 배열도, 배열 안에 객체도 들어갈 수 있음. var a = [1,2,3,"hello", null, true, []]; new Array() 문으로 선언할 수도 있지만, 보통은 간단히 '[]' 를 사용합니다. (new Array()는 현업에서 잘 안 씁니다. 둘 다 똑같이 동작하기 때문에 성능차이도 없습니다) 배열에는 length 속성이 있어 그 길이를 쉽게 알 수 있습니다. 배열에 원소 추가는 index번호와 함께 추가할 수 있습니다. var a = [4]; a[1000] = 3; console.log(a.length); //1001 cons..