본문 바로가기

자바스크립트49

[자바스크립트 기초] 스크립트 왕기초 개념 1 기초중의 기초 !! 컴퓨터는 데이터를 이용하여 세상을 표현하기 위한 모델을 만든다! 호텔, 자동차 같은 객체는 개발자가 데이터만 잘 만들고 전달해 주면 컴퓨터는 우리가 원하는 명령을 실행해서 작업을 수행할 수 있다. 객체와 속성컴퓨터에서 실제 세계에 존재하는 물리적인 물체는 다양한 종류(type)의 객체(object)로 표현된다. 개발자라면 그 객체들을 인스턴스라고 표현할 것이다.객체는 다음과 같은 정보를 가진다. 속성, 이벤트, 매서드 이 세 가지가 결합하여 객체를 표현하는 모델을 구성한다. 속성(특징): 자동차를 예를 들면 자동차의 속도, 색상, 크기 등이 속성이다. 속성은 이름과 값, 즉 name과 value로 구성된다. 예) 자동차의 속성이름 : 값제조사: 현대속도: 60km색상: 검정 실제 세계.. 2017. 2. 16.
11.자바스크립트 기초 문법 (window) # window의 open메서드 a.html====== b.html====== 장영실 # window.close() a.html====== b.html====== 장영실 # window.opener[ex]a.html====== b.html====== # setTimeout, setInterval, clearTimeout, clearInterval 초 var 객체=document.getElementById("문자열id이름");[ex] window.opener[ex]a.html====== b.html====== frame태그 a.html====== b.html====== b.html문서입니다. c.html====== c.html문서입니다. 예)a.html====== b.html====== b.html문서입니.. 2016. 12. 29.
왕 기초 자바스크립트 - 함수 var 처음만든함수 = function () { console.log("안녕하세요!");}; 처음만든함수();// 안녕하세요! ================== var 인사하기 = function (이름) { console.log("안녕하세요 " + 이름 + "님!");}; 인사하기("아이유");// 안녕하세요 아이유님! 인사하기("수지");// 안녕하세요 수지님! ==================var 고양이그리기 = function (반복횟수) { for (var i = 0; i < 반복횟수; i++) { console.log(i + " =^.^="); }}; 고양이그리기(5);// 0 =^.^=// 1 =^.^=// 2 =^.^=// 3 =^.^=// 4 =^.^= ==================.. 2016. 12. 29.
왕 기초 자바스크립트 - 객체 ===================================== ===================================== ===================================== 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013.. 2016. 12. 28.
왕 기초 자바스크립트 - 배열 ======================= ======================================= var 무작위단어 = ["폭발", "동굴", "공주", "펜"];var 무작위색인 = Math.floor(Math.random() * 4);무작위단어[무작위색인];// "동굴" 무작위단어[Math.floor(Math.random()*4)];// "공주" =====================================var 색상목록 = ["푸른", "붉은", "검은", "하얀"];var 자연목록 = ["늑대", "태양", "독수리", "바람"];var 단어목록 = ["눈물", "환생", "기상", "일격", "유령"]; // 색상목록 배열에서 무작위 단어를 하나 고릅니다var 색상 = 색상.. 2016. 12. 28.
10.자바스크립트 기초 문법 (노드메서드 2) 마우스를 따라다니며 그림이 움직인다. 2. document 구조 (배열) 3. name으로 접근 가능하다 # var 변수=document.getElementById("id이름"); ----------------------------------------------------------- # http://msdn.microsoft.com/ko-kr/library/d1et7k7c(v=vs.94).aspx # 노드관련 메서드 document.createElement("태그명") document.createTextNode("텍스트") 객체명.insertBefore(newChild,refChild) 객체명.replaceChild(newChild,oldChild) 객체명.removeChild(oldChild) 객체.. 2016. 12. 27.
★자바스크립트 연습 문제 (노드) 3 # http://msdn.microsoft.com/ko-kr/library/d1et7k7c(v=vs.94).aspx# 노드관련 메서드 document.createElement("태그명") document.createTextNode("텍스트") 객체명.insertBefore(newChild,refChild) 객체명.replaceChild(newChild,oldChild) 객체명.removeChild(oldChild) 객체명.appendChild(newChild) 객체명.parentNode 객체명.childNodes 객체명.previousSibling 객체명.nextSibling 버튼을 누르면 4.dd 가 출력될 수 있도록 소스코드를 작성하시오. aa bb cc [an] var liTag=document.c.. 2016. 12. 27.
9.자바스크립트 기초 문법 (노드메서드) # nodeName 1 2 3 # tagName[ex] aaa bbb ccc # var 변수=document.getElementById("id이름");[ex] aaa bbb ID를 입력하세요~ ----------------------------------------------------------- aaa bbb ID를 입력하세요~ [ex] aa jafkldsjfl;ajdfk cc [ex] [ex] [ex] 1 2 3 4 5 6 [ex] 123 [ex] 가나다 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737.. 2016. 12. 27.
★자바스크립트 연습 문제2 1문제 이벤트처리를 아래와 같은 형식으로 바꾸시오. 이벤트처리대상.on이벤트명=function(){ } 답 2.문제 3.문제 이벤트처리를 아래와 같은 형식으로 바꾸시오. 이벤트처리대상.on이벤트명=function(){ } 4.문제 5.문제 답 답 답 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122.. 2016. 12. 26.
8.자바스크립트 기초 문법 (confirm&prompt&parseInt&이벤트처리&String&DATE) # 확인대화상자 # 입력대화상자 # 문자열을 정수로 바꾸는 함수 [ex] [ex] [ex] # 함수1 선언적함수2 내부함수3 익명함수 [ex] ---------------------------- [ex] # 이벤트처리[ex] [ex] [ex] [ex] -------------------------------------------------------------- ------- # 태그[ex] http://www.naver.com">연결 [ex]a.html====== 연결 b.html====== 가나다라마바사 [ex] 버튼 ------------------------------- 글자 # 태그[ex] # String[sy] 변수=문자열.charAt(인덱스); 변수=문자열.indexOf(문자열); 변수=문자.. 2016. 12. 26.
9.자바스크립트 기초 문법 (정규표현식&아이디체크&위치표시) 1. 2 .3. 다음으로 이동 4. 영단어 : 5. 사이트를 선택하세요 네이버다음 구글 6. 사이트를 선택하세요 사이트를 선택하세요 네이버다음 구글 7. 마우스 이벤트 8 이름 : .9 이름 : 전화번호: 아이디 이름 이메일 .10 과일선택선택하세요사과배바나나 .11 위치정보 .12 위치정보 .13 파일읽기 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111.. 2016. 12. 23.
8.자바스크립트 기초 문법 (window&노드추가삭제) 1. 2. 아이템1아이템2아이템3아이템4아이템5 3. div 영역 div의 내용 div 변경 4. 여기를 클릭 첫번째 단락두번째 단락 단락제거 5. 6. 7. 버튼을 누르세요 확인 멈춤 8. 이동 이동 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131.. 2016. 12. 22.
★자바스크립트 연습 문제1 아래소스코드를 for문으로 바꾸시오. 1 2 3 4 5 6 7 8 9 10 아래소스코드를 for문으로 바꾸시오. 버튼을 누르면 h1태그의 border-style을 solid로 border-color를 yellow로 바꾸시오. abc 테이블만들기 줄 칸 abc 아래소스코드를 for문으로 바꾸시오. 함수를 하나로 처리하시오. onmouseover 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041.. 2016. 12. 21.
7.자바스크립트 기초 문법 (exception&문자열) 1. 2. 3. 4. 1부터 100까지확인5. 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160.. 2016. 12. 21.
5.자바스크립트 기초 문법 (객체&날짜계산&프로토타입) 1. 2. 3. 4. 구입날짜 : 검사 5.6. 7. 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815.. 2016. 12. 21.
4.자바스크립트 기초 문법 (객체 선언&배열&form) 1. 2. 3. 4. 5. 6.. 필드1 필드2 필드3 7. 클릭 8. 이름: 직급 : 확인 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511.. 2016. 12. 20.
3.자바스크립트 기초 문법 (for문&구구단) 1 2 3 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616.. 2016. 12. 20.
2.자바스크립트 기초 문법 if 문 &form 1a: b: 2 첫번째 정수: 두번째 정수 : 합계 : 3. 클릭하세요 4. 숫자 숫자 : 추측횟수:힌트: 5. 숫자 숫자 : 추측횟수:힌트: 정답: 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014.. 2016. 12. 19.
1.자바스크립트 기초 문법(요소에 접근&대화상자&배열&함수) 1. 인라인 자바스크립트 2. 3. 4. 2. test var s; //변수 선언(자료형이 없음) s = 100; // 가변자료형(우변의 데이터형에 따라 결정) document.write(s+" "); //웹브라우저에 출력 s="홍길동"; document.write(s+" "); 3. 문자 var s = "Hello World" var t = "How are you "+ "today"; //문자열 연결 document.write(s+" "); document.write(t+" "); //대문자로 변환 document.write(s.toUpperCase()+" "); // 소문자로 변환 document.write(s.toLowerCase()+" "); 4. 연산 function test(x,y){ x= p.. 2016. 12. 19.

티스토리툴바