해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: 문자열로 노드 제어 노드 변경 API에서는 여러 메소드를 이용해서 노드를 제어하는 방법에 대해서 알아봤었습니다. 그런데 이 방식은 복잡하고 장황하죠. 종류도 많고, 어지럽습니다. 좀 더 편리하게 노드를 조작하는 방법을 알아봅시다. innerHTML innerHTML은 문자열로 자식 노드를 만들 수 있는 기능을 제공합니다. 또한 자식 노드의 값을 읽어올 수도 있습니다. 예제로 살펴보도록 하겠습니다. HTML CSS get 버튼을 누르면 콘솔창에 위와 같은 결과가 출력됩니다. innerHTML 로 타겟의 하위 html 태그를 얻어온 것을 알 수 있습니다. set 버튼을 누르면 ..

해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: jQuery 노드 변경 API jQuery를 이용해서 노드를 제어하는 방법을 알아봅시다. jQuery에서 노드를 제어하는 기능은 주로 Manipulation 카테고리에 속해 있습니다. 아래 링크는 jquery api manipulation 관련 링크입니다. http://api.jquery.com/category/manipulation/ Manipulation | jQuery API Documentation Adds the specified class(es) to each element in the set of matched elements. Insert content, sp..

해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: 노드 변경 API 이번 포스팅에서는 노드를 추가하고, 제거하고, 변경하는 방법을 다뤄보겠습니다. 노드 추가 노드의 추가와 관련된 API들은 아래와 같습니다. appendChild(child) 노드의 마지막 자식으로 주어진 엘리먼트 추가합니다. insertBefore(newElement, referenceElement) appendChild와 동작방법은 같으나 두번째 인자로 엘리먼트를 전달 했을 때 이것 앞에 엘리먼트가 추가됩니다. 노드를 추가하기 위해서는 추가할 엘리먼트를 생성해야 하는데, 이것은 document 객체의 기능입니다. 노드 생성 아래 API는 노드를 생성하는 ..

해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: 노드 종류 API 저번 포스팅에서는 Node 객체가 무엇인지, 노드 객체에서 관계와 관련있는 API는 어떤 것이 있는지 알아봤었습니다. 이번 포스팅은 Node 종류 API 를 알아보도록 하겠습니다. 노드 작업을 하게 되면 현재 선택된 노드가 어떤 타입인지를 판단해야 하는 경우가 있습니다. 이런 경우에 사용할 수 있는 API가 nodeType, nodeName입니다. Node.nodeType node의 타입을 의미합니다. Node.nodeName node의 이름 (태그명을 의미합니다.) Node Type 노드의 종류에 따라서 정해진 상수가 존재합니다. 아래는 모든 노드의 종류..