전체 글260 JS create Element 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 //createElement : 태그 이름 //createTextNode : 태그 내용 입력.... 태그 속성..?정확한 명칭은 모르게음..ㅠ //setAttribute : 태그 내부에 입력 window.onload=function(){ let h=document.createElement('h1'); let txt=document.createTextNode('hello'); h.appendChild(txt); //태그에 hello 입력 let h2=document.createElement('h2'); let txt2=document.createTextNode('hello2.. 2019. 12. 9. JS add Event Listener (set Attribute) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 //스크립트 window.onload=function(){ var d1=document.getElementsByTagName('a'); //d1은 태그 'a'를 가리킴 for(let i =0;i 2019. 12. 9. JS getElement 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 //head- script - window.onload=function 내부 let e1=document.getElementById("t1"); let e2=document.getElementsByClassName("a"); let e3=document.getElementsByTagName("div"); /* id로 읽어오는것은 1개씩.. className, TagName으로 가져오는것은 '배열' */ //body hello hello2 hello3 //get element로 window.onload=function(){ document.getElementById("a1").style.back.. 2019. 12. 9. JS Array 배열 생성 방법 1 2 3 4 5 6 7 8 9 10 // 1. 배열 선언만. 자료 없음 var d1=[]; // 2. 2칸 생성만 선언 var d2=new Array(2); // 3-1. 4와 2가 들어갈 배열 선언 var d3=new Array(4,2); // 3-2. 3개가 들어갈 배열 선언 var d4=new Array("a","b","c"); 출력 방법 1 2 3 4 5 6 7 8 9 10 11 12 13 let arr=["a1","a2","a3"]; console.log(arr[0]); //a1 let arr3=new Array('z1', 'z2', 'z3'); console.log(arr3[0]); //z1 console.log(arr3[1]); //z2 console.log(arr3[2]).. 2019. 12. 6. JS Date 1 2 3 4 5 6 7 8 9 10 11 12 function n(){ let now=new Date(); let y=now.getFullYear(); let mo=now.getMonth()+1; let d=now.getDate(); let h=now.getHours(); let m=now.getMinutes(); let s=now.getSeconds(); document.getElementById('result').innerHTML=y+"."+mo+"."+d+" "+h+":"+m+":"+s; } 2019. 12. 6. JS 숫자 eval parseInt 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 let a='10'; let b=10; console.log(a+b); //eval이벨 parseInt console.log(eval('10')); // console.log(eval('abc')); //is not defined 에러 console.log(parseInt('10')); console.log(parseInt('abc')); //NaN console.log(isNaN('abc')); //true console.log(isNaN('10')); //false console.log(isNaN(10)); //false //NaN : not a Number 1 2 3 4 5 6 7 console.log(eval.. 2019. 12. 6. JS String ' ' 를 이용하여 변수 선언 1 let name='choi solyi'; new String으로 선언 1 let name2=new String('kim kaka'); charAt(n) : n번째 문자열 1 2 3 //charAt() n번째 자리의 글자 출력 console.log(name.charAt(0)); //0번째 문자 c console.log(name.charAt(1)); //1번째 문자 h length : 문자 길이 1 2 3 //length() 문자열 길이 출력 console.log(name.length); console.log(name2.length); indexOf(o) : o의 위치 indexOf(o, n) : n자리 뒤에있는 o의 위치 lastIndexOf(o) : o의 위치를 뒤에서부.. 2019. 12. 6. JS Function 선언적 함수 : function함수 이름으로 함수를 선언하며, 한번만 파생되는 정적함수 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 //1. 함수 생성 function f1(){ console.log('f1 function'); } f1(); //호출할땐 함수이름(); f1(); // 2. 외부에서 자료 받아줄때는 변수 선언을 하지않음. function f2(name, age){ console.log('이름: '+name); console.log('나이: '+age); } f2('choi', 20); f2('park', 22); // 3. return 받기 function f3(kor, eng, mat){.. 2019. 12. 6. JS for문 1 2 3 4 5 6 7 8 9 10 11 for(let i=1; i 2019. 12. 5. JS switch 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 let num=3; switch(num){ case 1: console.log('1입니다.'); break; case 2: console.log('2입니다.'); break; case 3: console.log('3입니다.'); break; default: console.log('기타') } 2019. 12. 5. JS if 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 window.onload=function(){ //다큐멘트에, 가져온다 btn버튼을. 클릭했을때 document.getElementById("btn").onclick=function(){ let a=parseInt(document.getElementById("jumsu").value); let result; if(a>=90) result='수'; else if(a>=80) result='우'; else if(a>=70) result='미'; else if(a>=60) result='양'; else result='가'; console.l.. 2019. 12. 5. JS Onclick 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 window.onload=function(){ document.getElementById("btn").onclick=function(){ //다큐멘트에, 가져온다 btn버튼 클릭했을때 = 기능실행 //1번째 방법 let a= document.frm.jumsu.value; //문자형 let a=parseInt(document.frm.jumsu.value); //숫자형 //2번째방법 let b= document.getElementById("jumsu").value; //문자형 let b=parseInt(document.getElementById("jumsu").value); //숫.. 2019. 12. 5. JS 산술 연산자 1 2 3 4 5 6 7 8 9 /*자바의 기본연산자와 큰 차이는 없다. */ console.log(2**3); //8 var i =10; console.log(++i); //11 console.log(i++); //11 console.log(4/3); //1.33 console.log(4%3); //1 cs 1 2 3 4 5 6 7 8 9 10 11 12 13 14 var t1=10; var t2='10'; //true > == :값끼리 비교함. 문자형숫자형 상관없이..값끼리만. console.log(t1==t2); //false > === :타입까지 비교해서 같은타입의 같은 값인지 비교! console.log(t1===t2); //숫자형 + 문자형은 연결해서 출력 된다. var v1='5'; var .. 2019. 12. 5. 이전 1 ··· 12 13 14 15 16 17 18 ··· 20 다음 반응형
