본문 바로가기

자바스크립트 API9

[ JavaScript ] 자바스크립트 기본 문법 | Text 객체 API(appendData,deleteData, insertData, nodeValue...) 이미지 출처 : https://commons.wikimedia.org/wiki/File:JavaScript-logo.png 해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: Text 객체 텍스트 객체는 텍스트 노드에 대한 DOM 객체로 CharcterData를 상속 받습니다. 아래는 텍스트 노드를 찾는 예제입니다. 우리가 주목할 것은 DOM에서는 공백이나 줄바꿈도 텍스트 노드라는 점입니다. Hello world Hello world target1의 첫번째 자식은 p 엘리먼트 입니다. 사이에 공백이 없기 때문이죠. 반면 target2 의 첫번째 자식은 text 입니다. 줄바꿈이나 공백 같은 것도 하나의 객체라고 인식하기 때문.. 2021. 2. 8.
[ JavaScript ] 자바스크립트 기본 문법 | Document 객체 이미지 출처 : https://commons.wikimedia.org/wiki/File:JavaScript-logo.png 해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: Document Document 객체는 DOM의 스펙이고, 이것이 웹브라우저에서는 HTMLDocument 객체로 사용됩니다. HTMLDocument 객체는 문서 전체를 대표하는 객체라고 할 수 있습니다. document 는 node 를 상속받았기 때문에, childNodes를 사용가능합니다. 위의 결과는 document 의 첫번째 자식은 이고, 두번째 자식은 html 태그 전체라는 것을 보여줍니다. 자바스크립트 기본 문법 :: Document 주요 AP.. 2021. 2. 8.
[ JavaSript ] 자바스크립트 기본 문법 | 노드 종류 API(nodeType, nodeName) 해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: 노드 종류 API 저번 포스팅에서는 Node 객체가 무엇인지, 노드 객체에서 관계와 관련있는 API는 어떤 것이 있는지 알아봤었습니다. 이번 포스팅은 Node 종류 API 를 알아보도록 하겠습니다. 노드 작업을 하게 되면 현재 선택된 노드가 어떤 타입인지를 판단해야 하는 경우가 있습니다. 이런 경우에 사용할 수 있는 API가 nodeType, nodeName입니다. Node.nodeType node의 타입을 의미합니다. Node.nodeName node의 이름 (태그명을 의미합니다.) Node Type 노드의 종류에 따라서 정해진 상수가 존재합니다. 아래는 모든 노드의 종류.. 2021. 2. 8.
[ JavaScript ] 자바스크립트 기본 문법 | 속성 API | Element.*Attribute(getAttribute,setAttribute...) 해당 포스팅은 생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅임을 미리 알립니다. 자바스크립트 기본 문법 :: 속성 API 속성은 HTML에서 태그명만으로는 부족한 것을 채워주는 부가적인 정보라고 할 수 있습니다. 이 속성을 어떻게 제어하는지에 대해 알아봅시다. 속성을 제어하는 API는 아래 리스트와 같습니다. Element.getAttribute(name) Element.setAttribute(name, value) Element.hasAttribute(name); Element.removeAttribute(name); 각각의 기능은 이름을 통해서 충분히 유추할 수 있을 것 같지만, 다시 설명 드리자면 Element.getAttribute(name) 는 name 이라는 이름을 가진.. 2021. 2. 7.