본문 바로가기
반응형

javascript pure66

10. DOM과 이벤트 처리-1 #1 DOM의 개념과 사용법 DOM(Document Object Model)은 웹 문서의 구조화된 표현을 제공하며, 자바스크립트를 사용하여 웹 문서를 동적으로 조작할 수 있는 API입니다. DOM을 이용하여 HTML 요소에 접근하고 조작하는 방법을 알아보겠습니다. 요소의 선택 DOM을 이용하여 HTML 요소를 선택하는 방법에는 여러 가지가 있습니다. getElementById getElementById 메서드를 이용하면 id 속성으로 HTML 요소를 선택할 수 있습니다. Hello World! getElementsByClassName getElementsByClassName 메서드를 이용하면 class 속성으로 HTML 요소를 선택할 수 있습니다. Hello World! This is a paragrap.. 2023. 3. 18.
9. 객체와 배열-3 #3 배열의 생성과 활용 배열의 생성 배열은 다음과 같이 생성할 수 있습니다. let arr = []; // 빈 배열 생성 let arr2 = [1, 2, 3]; // 숫자로 이루어진 배열 생성 let arr3 = ['apple', 'banana', 'orange']; // 문자열로 이루어진 배열 생성 배열의 활용 배열의 요소에 접근하기 배열의 요소에 접근할 때에는 인덱스를 이용합니다. 인덱스는 0부터 시작합니다. let arr = [1, 2, 3]; console.log(arr[0]); // 1 console.log(arr[1]); // 2 console.log(arr[2]); // 3 배열의 길이 배열의 길이는 length 속성을 이용하여 알 수 있습니다. let arr = [1, 2, 3]; con.. 2023. 3. 18.
8. 객체와 배열-2 객체의 속성과 메서드 객체는 속성과 메서드를 가질 수 있습니다. 객체의 속성은 값이나 함수를 포함할 수 있으며, 메서드는 객체의 행동을 정의하는 함수입니다. 아래 예제 코드에서는 person 객체를 생성하고, 속성과 메서드를 추가합니다. // 객체 생성 const person = { name: "John", age: 30, occupation: "developer", // 메서드 추가 sayHello: function() { console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`); } }; // 객체 속성 접근 console.log(person.name); // John console.log(person.age); // 3.. 2023. 3. 18.
7. 객체와 배열-1 객체는 프로퍼티와 메소드를 가지고 있는 자바스크립트의 핵심적인 개념입니다. 객체를 생성하는 방법에는 리터럴 표기법, 생성자 함수, 클래스 등이 있으며, 이번 섹션에서는 리터럴 표기법을 이용한 객체 생성 방법에 대해 알아보겠습니다. 객체 리터럴 표기법을 이용한 객체 생성 객체 리터럴 표기법은 중괄호({})를 이용하여 객체를 생성하는 방법입니다. 중괄호 안에 프로퍼티와 그 값들을 콜론(:)으로 구분하여 작성합니다. 여러 개의 프로퍼티가 있을 경우 콤마(,)로 구분합니다. const person = { name: 'John', age: 30, gender: 'male', greet: function() { console.log(`Hello, my name is ${this.name}.`); } }; 위 예제에.. 2023. 3. 18.
반응형

티스토리툴바