● 오늘 공부한 것 DOM #DOM(1) ● DOM - DOM(Document Object Model)로 HTML을 Object요소처럼 조작할 수 있는 Model이다. 즉, DOM은 HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 프로퍼티와 메서드를 제공하는 트리 자 ddaeunbb.tistory.com #DOM (자식노드와 부모노드의 존재 확인 + 형제노드) ● 자식노드의 존재 확인 자식(child) 노드 탐색 childNodes : 자식 노드 목록을 NodeList 형태로 리턴합니다. firstChild : 자식 노드 중, 첫번째 자식 노드를 리턴합니다. lastChild : 자식 노드 중, 마지막 자 ddaeunbb.tistory.com ● 끝맺음 느낀점 ㅜ ㅜ 뭐야 시..
분류 전체보기
문제설명 선분 3개가 평행하게 놓여 있습니다. 세 선분의 시작과 끝 좌표가 [[start, end], [start, end], [start, end]] 형태로 들어있는 2차원 배열 lines가 매개변수로 주어질 때, 두 개 이상의 선분이 겹치는 부분의 길이를 return 하도록 solution 함수를 완성해보세요. lines가 [[0, 2], [-3, -1], [-2, 1]]일 때 그림으로 나타내면 다음과 같습니다. 선분이 두 개 이상 겹친 곳은 [-2, -1], [0, 1]로 길이 2만큼 겹쳐있습니다. 제한사항 lines의 길이 = 3 lines의 원소의 길이 = 2 모든 선분은 길이가 1 이상입니다. lines의 원소는 [a, b] 형태이며, a, b는 각각 선분의 양 끝점 입니다. -100 ≤ a ..
● 요소 노드의 텍스트 조작 ⚬ nodeValue Node.prototype.nodeValue 프로퍼티는 setter,getter 둘 다 존재하는 접근자 프로퍼티이다. 즉, 참조와 할당 모두 가능하다는 의미이다. 노드 객체의 값이란 텍스트 노드의 텍스트이다. 따라서 텍스트 노드가 아닌 노드, 즉 문서 노드나 요소 노드의 nodeValue 프로퍼티를 참조하면 null을 반환한다. banana apple grape 즉, 텍스트 노드의 nodeValue를 참조할 때만 텍스트 노드의 값 즉, 텍스트를 반환한다. 텍스트 노드가 아닌 노드 객체의 nodeValue를 참조하면 null을 반환한다. => 쓰기도 번거롭고, 복잡하다.. ⚬ textContent Node.prototype.textContent 프로퍼티도 ..
● 자식노드의 존재 확인 자식(child) 노드 탐색 childNodes : 자식 노드 목록을 NodeList 형태로 리턴합니다. firstChild : 자식 노드 중, 첫번째 자식 노드를 리턴합니다. lastChild : 자식 노드 중, 마지막 자식 노드를 리턴합니다. 자식(child) 요소(element)탐색 children : 자식 요소(element) 목록을, 'HTMLCollection' 형태로 리턴합니다. firstElementChild : 자식 요소(element) 중, 첫번째 요소를 리턴합니다. lastElementChild : 자식 요소(element) 중, 마지막 요소를 리턴합니다. 1 2 3 text를 반환하는 이유는 텍스트 노드도 반환하기 때문이다. 따라서 outer 뒤에 있는 개행..
● DOM - DOM(Document Object Model)로 HTML을 Object요소처럼 조작할 수 있는 Model이다. 즉, DOM은 HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 프로퍼티와 메서드를 제공하는 트리 자료구조이다. HTML요소는 렌더링 엔진에 의해 파싱되어 DOM을 구성하는 요소 노드 객체로 변환된다. 이때 HTML 요소의 어트리뷰트는 어트리뷰트 노드로, HTML 요소의 텍스트 콘텐츠는 텍스트 노드로 변환된다. 위의 예제를 보면, 요소 노드 안에는 텍스트 노드도 있고 어트리뷰트 노드도 있다. 이처럼 노드는 중첩 관계를 갖는다. 이런 중첩 관계에 의해 계층적인 부자 관계(parent-child)가 형성된다. 트리 자료구조는 노드들의 계층구조로 이루어진다...
● 오늘 공부한 것 클로저 # 클로저 (closure) ● 클로저 - 클로저란 '함수와 그 함수가 선언된 렉시컬 환경과의 조합이다.' 사실 정의만보면 이해하기에 난해한 개념이라고 한다.. ^^ 사실 맞는 것 같다. 하지만 여기서 중요한 건 함수가 선언 ddaeunbb.tistory.com const adder = x => { return y => { return x + y } } console.log(adder(50)(10)) // 60 const subtractor = x => y => { return x - y } console.log(subtractor(50)(10)) // 40 위와 같이 클로저는 입력 값 받는 걸 기다리는 식으로 진행될 수 있다. ● 놓치고 있던 것 const arr = [1,2..
