본문 바로가기

전체 글56

[javascript] Dom이란? - 2 (Dom 트리) DOM 트리DOM의 기본 개념을 기반으로 문서의 계층 구조를 그림으로 나타낸 것을 DOM 트리라 한다. DOM(Document Object Model) 문서 객체 모델 위의 코드 계층 구조를 그림으로 나타내면 아래와 같다. 이때 그림에 나타낸 박스 하나하나를 노드라 부르고위아래 계층 구조에 부모 자식 관계, 좌우 계층 구조에 형제 관계가 맺어진다. + Node type)각 노드의 성격에 따라 노드를 분류한 것을 노드 타입이라고 하는데 총 12가지가 있다.주로 사용하는 것은 4가지이다.요소 노드 : html 태그에서 만들어지며 dom 트리를 구성하는 블록이 되는 노드텍스트 노드 : 오로지 텍스트로만 이루어진 노드 문서 노드 : dom의 진입점이 되는 document 노드주석.. 2022. 9. 5.
[javascript] DOM이란? - 1 (문서 객체 모델) DOMdocument object model의 약자로 HTML이나 XML 문서에 접근하기 위한 일종의 인터페이스이다.문서의 요소를 정의하고 요소에 접근하는 방법을 제공한다. DOM은 nodes와 objects로 문서를 표현하며, 이들은 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할을 담당한다. DOM은 웹 페이지의 객체 지향 표현이며, 자바스크립트와 같은 스크립팅 언어를 이용해 DOM을 수정할 수 있다. DOM_mdn web docs DOM의 활용//id로 태그 선택하기document.getElementById('id이름');//class로 태그 선택하기document.getElementsByClassName('class이름');//태그 이름으로 태그 선택하기docum.. 2022. 9. 5.
[js] 프로그래머스 - 소수 찾기 프로그래머스 lv.1 소수 찾기 1) n이 1과 2일 때의 경우를 따로 빼주었다. 1과 2인 경우를 제외하면 규칙적인 코드 작성이 더 간편해지기 때문이다.if (n == 1) return 0;if (n == 2) return 1; //n=2일 때는 자기 자신이 소수이므로 2) n이 3 이상일 때의 경우 3부터 n까지 for문을 걸어 카운트업 해준다. (소수 합성수 구분 없이 우선 세어 줌)이때 각 i에 대하여 2부터 i의 제곱근까지의 수로 i를 나누어보고 나누어떨어진다면 소수가 아니므로 카운트다운 해준다.이때 i의 제곱근 대신 i / 2로 해도 가능은 하나 시간 초과가 뜬다. (더불어 효율성 테스트도 모두 실패)for (i = 3; i 처음엔 break를 잘 사용할 줄 몰라 애먹었었는데, 이번에 다시.. 2022. 8. 31.
[js] 프로그래머스 - 시저 암호 프로그래머스 연습 문제 lv1 시저 암호 문제 설명 어떤 문장의 각 알파벳을 일정한 거리만큼 밀어서 다른 알파벳으로 바꾸는 암호화 방식을 시저 암호라고 합니다. 예를 들어 "AB"는 1만큼 밀면 "BC"가 되고, 3만큼 밀면 "DE"가 됩니다. "z"는 1만큼 밀면 "a"가 됩니다. 문자열 s와 거리 n을 입력받아 s를 n만큼 민 암호문을 만드는 함수, solution을 완성해 보세요. 제한 조건공백은 아무리 밀어도 공백입니다.s는 알파벳 소문자, 대문자, 공백으로만 이루어져 있습니다.s의 길이는 8000이하입니다.n은 1 이상, 25이하인 자연수입니다.입출력snresult'AB'1'BC''z'1'a''a B z'4'e F d' 정말 단순한 문제인데 푸는데 시간을 좀 투자한 문제이다. 문자열을 다루는 데.. 2022. 8. 29.
[javascript] 객체 접근 - 객체 프로퍼티(property) 열거 & 조작 프로퍼티 열거 _ 객체 순회배열 열거프로퍼티 열거배열 순회객체 순회순서 보장순서 미보장length, index 있음length, index 없음for, for-in, forEach, map, filter, reduceobject.keys, for-in, object.values, object.entries 1) Object.keys() _ 객체에서 key를 배열로 변환 var info = { age: 20, name: "길동", interest: ["music", "dancing"], desc: function() { alert("정보입니다."); }};Object.keys(info); //output: ["age", "name", "i.. 2022. 8. 29.

티스토리툴바