본문 바로가기

SK 행복성장캠퍼스/Java Script5

2020-09-21,JavaScript_3일차 (Event, DOM) Event 시스템이 발생시킨 event 또는 사용자가 입력장치로 발생시킨 event 이벤트 발생 --> javascript 함수로 이벤트에 대한 기능 구현 Event와 Event 기능 함수 의 연결 ---> Event Handler ( ex> onclick, onkeyup, .....) Event Handler 설정 방법 2가지 DOM Level 1, Level 2 Event Object event.preventDefault() : 기본적인 html의 동작처리를 비활성화 event.stopPropagation() : 중첩된 태그의 이벤트 전파를 방지. (자식 노드 이벤트 실행시, 부모 노드의 이벤트 실행을 막음) DOM Level 0 인라인 방식 DOM Level 0의 인라인 방식 OK A1 A2 A3 .. 2020. 10. 5.
2020-09-21,JavaScript_3일차 (BOM) 3일차에서는 BOM, Event, DOM에 대해 배웠고 JSON과 Ajax에 대해서도 살펴보았습니다. 아마 내용은 분리되어 포스팅될 것 같습니다. 먼저, BOM이란 Browser Object Model을 뜻하며 웹 브라우저의 모든 객체들을 참조하는 브라우저 모델을 말합니다. The Browser Object Model (BOM) is a browser-specific convention referring to all the objects exposed by the web browser. Unlike the Document Object Model, there is no standard for implementation and no strict definition, so browser vendors are .. 2020. 10. 4.
2020-09-18,JavaScript_2일차(2) data 형에 대한 설명입니다. 문자열, 수치 데이터, 날짜, 배열에 대한 설명입니다. 문자열 문자열의 길이 .length 특정 위치의 문자 확인 .charAt(index) 문자열 연결 1) "문자열" + "문자열 2) 문자열 변수 + "문자열" 3) 문자열변수.concat("문자열1", "문자열2", "문자열3") 특정문자의 위치 문자열변수.indexOf('문자') (문자가 없을 때는 -1 반환) 소문자로 .toLowerCase() 대문자로 .toUpperCase() 문자열 슬라이싱 .substring(시작 위치, 끝 위치) / .substr(시작점, 반환 갯수) 기준을 잡아서 문자열 분리 .split("기준(/ , (공백) 등)") 문자 교체 .replace("old", "new") 공백 삭제 .tr.. 2020. 10. 4.
2020-09-18,JavaScript_2일차 이번에는 자바스크립트의 연산자와 if, switch 제어문, 반복문, 함수에 대해 소개하도록 하겠습니다. 산술연산자 정수열 문자열을 정수형으로 변환할때는 parseInt()를 사용하거나 Number.parseInt()를 사용합니다. 대입연산자 비교연산자 실제값을 비교할 때는 ==, 값과 함께 타입까지 비교할 때는 ===를 사용합니다. 논리연산자 False로 처리되는 데이터 -0 -"" -null -undefined -NaN (Not a Number) 증감연산자 증감연산자 주의할점 : 전치 -> 대입 전에 연산 완료, 후치 -> 대입 후 연산 완료 3항 연산자 = if~else문 조건식 ? 참 : 거짓; if문 for문 Break, Continue 향상된 for문 for ( 변수 in array) -> 0.. 2020. 9. 28.
2020-09-17,JavaScript_1일차 대망의 자바 스크립트. HTML을 동적으로 움직이게 만들어주는 존재. 막판에 가서 이상해져서..... 제대로 집중 못하고..... 그게 Django시간에도 영향을 미치고 있는 자바스크립트! 빨리 정리를 했어야했는데... 주중에는 아파서 못 하고. 주말에는... 술 먹고 하루를 날렸고. 일요일이 되서야 시작하는데.... 벌써 6시;;; ㅎ;;;;;;;; 쨋든, 시작! (시간이 촉박하니... 빠르게 빠르게. 중요하거나 내가 모르겠는 건 좀 깊이.) 01_Basic JavaScript 설정 방법 1. Html의 내부에서 javascript 생성, head에 태그 설정하기 (Internal 방식) javascript 설정방법1 - head태그에 설정 2. Html의 외부에서 js파일로 javascript를 생성.. 2020. 9. 27.

티스토리툴바