Front/JavaScript16 [JavaScript] NodeList(노드 리스트) 관련 / 노드의 부모, 자식 / 노드 생성, 수정, 삭제 / 불특정 노드 접근하기 getElementsByTagName(), getElementsByClassName() : 의 결과 값은 검색된 모든 노드를 NodeList 라는 객체에 담아서 반환이 됨. NodeList 는 자주 사용하는 배열과 비슷한 일종의 ArrayList 컬렉션 객체로 DOM 객체 중 하나임. createElement() : 노드 생성 및 추가 createTextNode() : 텍스트 노드 생성 및 추가 appendChild() : 특정 태그의 자식 노드로 추가 insertBefore() : 특정 노드 이전에 노드 추가 NodeList 객체에서 제공하는 프로퍼티와 메서드 - length : 결과 값의 전체 갯수 정보가 담겨져 있음. - item() : 결과 값을 항목별로 접근할 때 사용함. - childNodes.. 2021. 4. 27. [JavaScript] DOM - 내장함수, 유효성 검사 자바스크립트 내장 함수 - 자바스크립트에서 자체적으로 제공해 주는 함수. - setInterval() : 일정한 시간마다 주기적으로 특정한 함수를 호출. 반드시 개발자가 종료(clearInterval())를 시켜주어야 함. 형식) setInterval(호출할 함수 이름, 시간(ms)); 내장함수 setInterval() 여기는 텍스트 영역입니다........ 시작 종료 시작을 누르면 1초 단위로 빨간색과 파란색이 계속 왔다갔다 한다. 종료 버튼을 누르면 종료 된다. 유효성 검사 아이디 비밀번호 이 름 주 소 2021. 4. 26. [JavaScript] DOM(Document Object Model) DOM(Document Object Model : 문서 객체 모델) - 웹 화면에 보이는 요소를 조작하기 위한 기능으로 가득 찬 라이브러리 덩어리. - 웹 브라우저가 HTML 페이지에 접근하는 방법을 정의한 API임. - DOM에서 제공하는 일반적인 기능은 여러 개의 DOM 객체로 나눠 구성되어 있음. - DOM은 정의부분(명세서)와 구현부분으로 나누어져 있음. - 정의부분인 명세서에는 웹 페이지 문서를 조작할 때 지켜야 할 약속(규칙, 규약)이 명시되어 있는 문서일 뿐 실제 동작하는 구현 소스코드는 전혀 존재하지 않음. 텅 빈 상자와도 같음. 그리고 이 명세서를 만드는 곳이 바로 웹 관련 표준을 정의하는 협회인 W3C임. 구현부분은 바로 브라우저 내부에 존재함. - 브라우저 제작사(IE, Chrome,.. 2021. 4. 26. [JavaScript] BOM(Browser Object Model) BOM(Browser Object Model) : 브라우저 객체 모델 - 브라우저 내에 내장된 객체. - BOM 객체의 최상위 내장 객체는 window 객체임. * window 객체의 주요 메서드 - open() : 새로운 창을 띄우고자 할 때 사용하는 메서드. - alert() : 경고 창을 띄울 때 사용하는 메서드. - prompt() : 질의/응답 창을 띄울 때 사용하는 메서드. - confirm() : 확인/취소 창을 띄울 때 사용하는 메서드. - moveTo() : 창의 위치를 이동시킬 때 사용하는 메서드. - resizeTo() : 창의 크기를 변경시킬 때 사용하는 메서드. - setInterval() : 일정 간격으로 지속적으로 실행문을 실행시킬 때 사용하는 메서드. - setTimeout(.. 2021. 4. 26. [JavaScript] 객체(Object), 내장 객체(Date, Math) 객체 생성 방법 첫번째 let product = {name: 'Galaxy S21', type: '핸드폰', company: '삼성'}; 객체 생성 방법 두번째 let product = {}; product[name] = 'Galaxy S21'; product[type] = '핸드폰'; product[company] = '삼성'; 내장 객체 : 자바스크립트에서 제공해 주고 있는 객체. Date : 날짜와 시간과 관련된 정보를 제공해 주는 객체 - getYear() : 1900년을 기준으로 연도를 반환하는 함수. - getFullYear() : 현재 연도를 반환하는 함수. - getMonth() : 현재 몇 월인지 반환하는 함수. +1을 해줘야한다. - getDate() : 현재 며칠인지 반환하는 함수. .. 2021. 4. 26. [JavaScript] 함수(Function) * 함수(function) : 기능을 정의해 놓은 것. 함수는 하나의 로직을 재사용할 수 있도록 하는 것으로 코드의 재사용성을 높여줌. 형식) function 함수명(매개변수1, 매개변수2) { 함수 호출 시 실행될 문장; return 반환값; } * 매개변수 : 일종의 외부 데이터를 함수 내부로 전달하는 매개체 역할을 하는 변수. 함수 외부에서 함수 내부로 값을 전달하는 방법이 바로 매개변수를 이용. 함수 사용 시 장점 1. 코드의 중복 제거 및 코드 재사용 가능. 2. 유지보수 용이성. 자바스크립트 함수의 종류 1. 사용자 정의 함수 : 사용자가 직접 만들어 놓은 함수. 2. 내장 함수 : 자바스크립트에서 자체적으로 제공해 주는 함수. * 리턴값(return) : 함수 내분에서 처리된 결과값을 함수 .. 2021. 4. 26. 이전 1 2 3 다음
