VScode/JavaScript
-
[JavaScript] DOMVScode/JavaScript 2022. 9. 9. 14:13
문서객체 모델(DOM, document object model) -넓은 의미: 웹 브라우저가 HTML 페이지를 인식하는 방식 -좁은 의미: document 객체와 관련된 객체의 집합 -HTML 페이지에 태그를 추가, 수정, 제거할 수 있음 -기본적인 자바스크립트만으로 DOM을 다루기에는 너무 복잡하므로 간단한 내용만 살펴보고 자세한 내용은 jQuery와 함께 DOM 관련 용어 -문서 객체: html or body 태그를 자바스크립트에서 이용할 수 있는 객체로 만들면 그것이 문서 객체 -노드: 각 요소(head, body, title, script, h1, HEADER...) --요소노드(Element Node): HTML 태그 --텍스트노드(Text Node): 요소 노드 안에 들어 있는 글자 -정적..
-
[JavaScript] vaildation, select tag, visibility, checkVScode/JavaScript 2022. 9. 8. 17:57
vaildation 사용자 등록 아이디 * 비밀번호 비밀번호 확인 이름 이메일 전화번호 - - * 는 필수 입력사항입니다 로그인 되었습니다 select tag, visibility 대한민국 +82 그리스 +30 뉴질랜드 +64 프랑스 +33 +82 +1 Canada +1 United States +63 Philppines +62 Indonesia +84 Vietnam +55 Brazil +86 China +85 HongKong +82 Korea 성별 남성 여성 취미 스포츠 영화 독서
-
[JavaScript] ImageVScode/JavaScript 2022. 9. 8. 17:54
getElementById -자바스크립트에서 바디 안의 id 셀렉터 값을 지목하는 방법 -document.getElementById("아이디값") onmouseover -해당 태그에 마우스 포인터가 올라가면 일어나는 이벤트 onmouseout -해당 태그에서 마우스 포인터가 밖으로 벗어나면 일어나는 이벤트 1. 마우스로 이미지 변환 2. 이미지 이름 입력받아서 이미지 변환 3. 마우스 클릭으로 지정된 범위까지 이미지 변환 4. 지정된 범위까지 자동으로 이미지 변환 5. clearInterval() -함수를 종료시키는 명령어 // 창을 실행시킬 때부터 start() 함수가 시작됨 // 이미지에 마우스를 올리면 변화하던 이미지가 멈춤 6. 마우스로 함수 2개를 실행/정지 번갈아 시키기 css style을 이..
-
[JavaScript] BOMVScode/JavaScript 2022. 9. 8. 17:51
-브라우저 객체 모델(BOM: browser object model) -BOM이란 자바스크립 트내에 내장되어 있는 관련 객체들의 집합을 의미 -웹브라우저를 대상으로 하여 외관으로 보이는 외형이나 내부에 저장된 각종속성들을 조정하고 싶다면 자바스크립트가 제공하는 그에 관련된 객체들을 이용하여 조정하고 컨트롤함 -자바스크립트에서는 윈도우나 웹브라우저 등을 객체로 정의해서 그 안에 여러구성요소들을 멤버변수나 멤버메서드로 접근하고 조정할 수 있게 각종객체를 제공함 -window, screen, location, navigator, history, document등 1. window 객체 -브라우저 기반 자바스크립트 최상위 객체 -alert(), prompt(), confirm() 함수 모두 window 객체의 ..
-
[JavaScript] functionVScode/JavaScript 2022. 9. 8. 17:43
-자바의 메서드와 같은 뜻의 문법요소임 -반복되거나 단위로 구성될 명령을 하나의 이름으로 묶어놓고, 명령이 필요할 때 이름을 불러 실행하는 구조 -보통 head 태그 안의 스크립트 영역에서 함수를 정의해놓고, body의 이벤트에 연결하여 실행시킴: 벼튼이 클릭되면 실행되는 자바 스크립트 함수의 정의 -함수는 선언적 함수와 익명 함수가 있음 -선언적 함수는 생성당시 부를 이름을 부여해서 만드는 함수를 의미하고, -익명 함수는 이름을 지정하지 않은 상태로 만들어서, 함수자체를 변수에 저장하여 변수이름으로 사용하곤 함 선언적 함수 -함수는 익명 함수이든 선언적 함수이든 head 영역의 script 태그 안에서 또는 body 영역의 script 태그 안에서 어디서든 호출 가능 -move(); → head의 스크..
-
[JavaScript] if, loopVScode/JavaScript 2022. 9. 8. 17:38
if문 날짜 -자바스크립트에도 자바와 같이 활용할 주요 내장 클래스들이 존재함. -새로운 객체를 생성하기 위해 new는 명령과 함께 객체를 생성하여 사용함 -자바 스크립트의 if문의 사용은 자바에서의 사용과 똑같음 while 반복문 var value=0; var startTime=new Date().getTime(); // 오늘 날짜 현재시간의 밀리초 환산값 // document.write(""+startTime+""); endTime=startTime+1000; while(new Date().getTime() '포도 사과 바나나 망고' 출력 for in 반복문 var array=['포도','사과','바나나','망고']; for(var a in array){ // 배열의 값이 전달되지 않고, 배열의 인덱..
-
[JavaScript] BasicVScode/JavaScript 2022. 9. 8. 17:33
-Html5 언어로 마크업하며 만드는 웹페이지의 정적인 기능들을 확장하고 페이지를 조금 더 동적으로 만들기 위해 사용하는 프론트 개발 언어임 -주로 Html5에서 불가능한 사칙연산 및 관계 연산 등을 실행할때 사용하며 기능적인면이나 이벤트(클릭, 더블클릭 등)에 대한 동작을 처리하는데 사용됨 -브라우저 및 화면에 표시될 태그들을 대상으로 하는 객체들이 정의되어 있으며 자바의 객체지향 언어 형식의 프로그램이 작성됨 -브라우저 상에서 일어날 수 있는 사용자 입력, 해당 연산, 이벤트에 의한 출력의 기능을 구현함 *자바 스크립트의 주석문은 자바 주석문과 똑같이 사용됨(여러줄 주석처리: /* */, 한줄 주석처리: //) Head안의스크립트실행명령들 1. 출력관련명령 -alert명령은 자바스크립트 안에 내장된 ..