본문 바로가기

Study/JavaScript12

[JavsScript] DOM 구조 DOM(Document Object Model) 구조란? 문서 객체 모델로, 웹브라우저가 HTML페이지를 인식하는 방식이다. DOM은 웹 페이지(HTML이나 XML)의 콘텐츠 및 구조, 스타일 요소를 구조화 시켜 표현해 JavaScript 언어가 쉽게 웹페이지에 접근해 읽고 조작할 수 있도록 연결시켜주는 역할을 한다. document -> 문서 . -> 접근 get -> 가지고오다 Element ->요소 ByID -> 아이디로 let h1Element = document.getElementById('h1Tag'); console.log(h1Element); 김밥 라면 떡볶이 NodeList는 웹 페이지의 HTML 문서 내에서 선택한 요소 뿐만 아니라, 텍스트, 주석, 속성 등의 모든 노드를 문서 내 정렬.. 2024. 2. 8.
[JavaScript] 객체 객체 : 여러 데이터를 하나의 변수에 저장할 수 있는 데이터 타입 - if 구조 : {key1:value2, k2: v2...} - key: 객체의 속성(property) - value: 속성의 값/ 기본자료형, 함수, 배열, 객체 // 객체 생성 let person ={ "name": "youngD", age: 20, male:true, intre: ()=>{ console.log('안녕하세요!'); }, favorite: { food: "pizza", drink: "coffee" }, epl: ['손흥민', '황희찬', '케인'] } console.log(person); // 객체 접근 console.log(person); console.log("이름 :", person.name); console.l.. 2024. 1. 26.
[JavaScript] 함수, 계산기 만들기 함수 선언 어디서든 호출 가능 함수 선언은 다음과 같은 함수 키워드로 구성 함수의 이름 함수의 매개변수들, 괄호로 묶고 쉼표로 구분 함수를 선언하는 JavaScript 문으로 중괄호로 묶는다 { /* ... */ } function greet(name){ console.log(`안녕하세요 저는 ${name}입니다.`); } greet('youngD'); 인자를 파라미터에 전달 -> 입력된 매개변수를 활용 greet 이라는 간단한 함수 정의 greet() 함수에 정의된 매개변수는 name에 저장 함수선언문은 코드를 구현한 위치와 관계없이 자바스크립트의 특징인 호이스팅에 따라 브라우저가 자바스크립트를 해석할 때 맨 위로 끌어 올려진다.(= 선언 전에 호출돼도 정상 동작) // 두 숫자를 연산하여 결과값을 출.. 2024. 1. 25.
[JavaScript] 배열 배열(array) : 이름과 인덱스로 참초되는 정렬된 값의 집합 배열을 구성하는 각 값을 배열 배열 요소(element)라고 하고 배열에서의 위치를 인덱스(index)라고 한다 배열 생성하는 법 1. 배열 리터럴 대괄호([ ])를 사용하여 만들기 let array = [ ]; let array = []; 2. Array() 생성자 함수로 배열 생성 var arr = new Array(); arr[0] = 'zero'; arr[1] = 'one'; arr[2] = 'two'; for (var i = 0; i < arr.length; i++) { console.log(arr[i]); } 배열 활용 // 인덱스 활용 : 배열에 값 넣어주기 array[0] = 1; array[1] = 2; // 2-3 push.. 2024. 1. 23.

티스토리툴바