인터넷응용프로그래밍 JavaScript(array)
Ex1-1) Using Arrays html css
Ex1-2) Using Arrays JS JS 배열의 특징 var comp = new Array(); comp[0] = “Apple”; // 문자열 comp[1] = new Date(); // 객체 comp[2] = 3.14; // 정수
Ex2) Initializing arrays JS
Ex3) array with for html JS 변수에 객체의 속성이 하나씩 대입
Ex4-1) Array Counter html css
Ex4-2) Array Counter 버튼 이벤트 처리 주사위 이미지의 id를 통해 반환 값 배열에 저장 주사위 숫자당 빈도 카운터 계산 (1 ~ 6) 함수 호출 랜덤 숫자를 할당하여 그에 맞는 이미지를 불러내는 함수 호출
Ex4-3) Array Counter
Ex5) Random Image Generator Using Array 랜덤으로 생성된 이미지의 이름을 배열 index를 통해 접근하여 저장된 문자열의 이름으로 받아옴 클릭이벤트 설정
Ex6-1) Passing Arrays to Functions
Ex6-2) Passing Arrays to Functions call by reference call by value
Ex7) Sorting an Array 정렬 함수
Ex8) Searching Arrays with Array Method indexOf 배열의 인덱스에 2를 곱한 값을 저장 원하는 문자열이나 숫자로 검색 해당 검색 문자열이 속한 인덱스 리턴 만약 존재하지 않으면 -1리턴 배열의 인덱스에 2를 곱한 값을 저장
Ex9) Multidimensional Arrays html css JS
Ex10) 연관 배열 문자열로 배열의 인덱스와 같이 접근하므로 id를 인덱스 처럼 바로 사용이 가능한 이점이 있음
Ex11) Character Processing Methods 해당 인덱스의 문자 반환 해당 인덱스의 문자의 아스키 숫자 반환 캐릭터 숫자를 문자로 변환 문자열을 소문자 / 대문자로 변환
Ex12) Searching Methods 앞에서 차례로 검색 뒤에서 차례로 검색 12번째 인덱스부터 마지막까지 차례로 검색 12번째 인덱스부터 처음까지 차례로 검색
Ex13) Splitting Strings and Obtaining Substrings “ ” 를 구분 자로 토큰을 나눔 토큰 당 “</p><p class = 'indent'>”로 구분을 함 0번째 문자열부터 10번째 문자열까지 출력
Ex14) Date Object
DOM(Document Object Model) 인터넷응용프로그래밍 DOM(Document Object Model)
Ex1) DOM tree DOM으로 우리는 무엇을 할까?? 자바스크립트를 사용하여 DOM트리를 순회하면서 페이지 안 요소의 내용이나 속성, CSS 스타일을 우리 마음대로 동적으로 변경
Ex2) DOM & BOM
Ex3) id, name으로 HTML 요소 찾기
Ex4) 태그 이름으로 HTML 요소 찾기 먼저 문서 내의 첫 번째 <ul> 요소를 찾음 list 안에서 첫 번째 <ul>안의 모든 <li>를 찾아 배열로 반환 각 li의 첫 번째 자식 노드의 data 필드를 출력
Ex5) 요소 스타일 변경하기
Ex6) DOM 노드 삭제와 추가
Ex7) DOM 이벤트
Homework) 계산기 만들기 DOM 요소를 이용하여 value 데이터의 값을 갱신(계산기 화면) input은 0 ~ 9 번까지의 버튼, */-+ 사칙연산, 초기화 버튼, 계산 버튼으로 구성 버튼은 DOM 이벤트를 통해서 처리 계산 기능은 자바스크립트 기본 함수에서 지원하니 찾아서 써봄 구현을 마치고 계산기의 DOM TREE를 그려서 낼 것 과제 제출물 : 계산기 제작 코드 파일(*.html), DOM TREE 문서(*.hwp or 이미지 파일)