본문 바로가기
반응형

Javascript 15

[java script 개념] 자바 스크립트 기본 개념 정리 자바스크립트(java script)는 HTML 언어에 추가되서 웹페이지를 동적으로 다양하게 제작할 수 있게 도와주는 스크립트 언어이다. 스크립트 언어는 혼자 실행될 수 없어서 다른 언어에 포함되어 실행되고, 문법이 복잡하지 않은 특징을 가지고 있다. 즉, 자바스크립트는 HTML 안에서만 구현된다. 공식 명칭은 [ECMAScript] 이름 특징 태그 태그 컨텐츠 출력 , 등 CSS 디자인 담당 java script 동적인 조작 기법 자바 스크립트 기능 1. 유효성 체크 : 데이터가 DB에 저장될 수 있는지, 부족한 것은 없는지 검사 2. 태그 속성값 또는 태그 자체의 입력/수정/삭제 : html의 태그 컨트롤 3. AJAX를 통한 웹서버와의 데이터 통신 4. 동적인 메뉴 제작, 이미지 효과 등 AJAX: .. 2020. 8. 16.
[Event 객체] 웹에서 발생하는 모든 움직임 : event 객체 종류 정리, 클릭, 키보드 번호 Event 객체 자바스크립트 BOM 객체(브라우저 객체) 중 웹화면에서 발생하는 모든 움직임을 관리하는 객체. 객체 생성은 없음. event.속성변수 event 종류 abort 이미지 로드 실패 blur 입력양식에 있던 커서가 빠져나감(예 : 검색창에 검색어를 치다가 검색버튼을 누름) change 입력양식의 내용 변경(value 값 변경) click 마우스 왼쪽버튼 클릭 dbclick 마우스 왼쪽버튼 더블클릭 dragdrop 마우스 드래그 error 에러 발생 focus 입력창양식에 없던 커서가 생겨남(예 : 네이버 들어가면 자동으로 검색창에 커서가 가 있음) keydown 키보드 누름 keypress 키보드 누름 keyup 키보드에서 눌렀다가 손을 뗌 load 웹브라우저에서 html 문서가 읽혀짐 un.. 2020. 8. 15.
[생성자 함수] 사용자 정의 객체를 이용해 테이블 출력, 데이터 내림차순 정열 예제 생성자 함수 자바스크립트에서 메소드와 속성변수로 구성된 함수. 자바스크립트는 클래스가 없다. 때문에 개발자가 직접 생성자 함수를 제작해서 new를 이용해 객체를 생성한다. 관례적으로 생성자 함수는 첫 글자를 대문자로 쓰는 파스칼 표기법을 따른다. function 생성자함수명( [매개변수1] ){ this . 속성변수명 = 데이터1; this . 메소드명 = function( [매개변수2] ){ 실행코드; [return [데이터2]; ] } }; 또는 메소드 대신 생성자함수명.prototype. 메소드명 = function(~)~ 형태 사용. 생성자함수는 메모리공간에 올라가 객체화되고, 객체화 후에 메소드와 속성변수를 호출할 수 있다. 생성자 함수를 이용하여 3명의 학생의 성적을 출력해라. 1. Sungj.. 2020. 8. 14.
[DOM 객체] 유효성체크 : 회원가입창에 입력된 데이터 관리하기 DOM DOM(= Document Object Model) 웹브라우저가 html 파일의 태그들을 읽어 객체를 생성하고, 이 객체에 대응하는 컨텐츠를 웹브라우저 화면으로 출력하는 일련의 과정 또는 모형을 말한다. 즉, XML이나 HTML 문서에 접근하기 위한 일종의 인터페이스이며, 이 객체 모델은 문서 내의 모든 요소를 정의하고, 각각의 요소에 접근하는 방법을 제공한다. DOM 객체는 DOM API 를기반으로 생성되며 대부분의 웹브라우저는 동일한 DOM API 를 가지고 있다. DOM 객체 HTML 문서 안의 태그를 읽어 만들어지는 객체를 DOM 객체라고 부른다. 유효성 체크 DB에 저장될 수 있는 데이터인가 아닌가를 체크하는 일련의 검사. 입력양식들의 유효성 체크를 한 후 모두 유효성에 합당하면 서버로 .. 2020. 8. 13.
[Window 객체] 브라우저 창을 움직이는 객체 : 페이지 이동, 카운트다운 출력하기 Window 객체 자바스크립트에서 웹화면(브라우저) 전체를 담당하는 전역 객체. 브라우저 전체를 담당하는 Window 객체 안에는 여러 내장 객체들이 속해있다. Frame 객체 : 2개 이상의 문서가 조합되어 만들어지고 배열로 이루어져 있는 객체. 프레임을 제어한다. length를 이용해서 프레임의 갯수를 알 수 있고, 각 프레임의 정보에 접근 가능. Location 객체 : 현재 열려진 웹 화면의 URL 주소와 관련된 정보 제공. History 객체 : 웹 브라우저의 히스토리(방문한 적이 있는 URL 주소)를 관리. Document 객체 : 문서의 정보(제목, 변경날짜, 시간 등)를 관리. 원하는 내용을 출력하거나 문서의 정보를 제공해준다. ex)document.getElementById : 주어진 문.. 2020. 8. 12.
[String 객체] 문자열 복사 후 바꿔서 출력 : substr(), substring(), split() .substr( n , l ) 문자열에서 특정 부분만 골라내어 가져오는 메소드. 시작 인덱스번호 n부터 l만큼의 길이를 가져온다. l은 생략이 가능하다. l이 없다면 문자열 끝까지 가져옴. var str = new String("Made In Korea"); document.write( str.substr(8,3)+""); // 8번부터 3개까지 가져와라 Kor .substring( n , m ) 문자열에서 특정 부분만 골라내어 가져오는 메소드. 시작 인덱스번호 n부터 끝나는 인덱스번호 m까지를 가져온다. m은 생략이 가능하다. m이 없다면 문자열 끝까지 가져옴. var str = new String("Made In Korea"); document.write( str.substring(8,11)+"");.. 2020. 8. 10.
반응형
LIST