JavaScript (10) 썸네일형 리스트형 자바스크립트를 이용하여 새로운 텍스트 상자를 추가하는 방법! 1. clonenode를 이용하여 자식요소를 복제한다 list 에 해당하는 parent를 생성한 뒤, parent에 appendChild(복제할요소.clondeNode(true)) 를 하여 복제한다. 2.parent.removeChild를 이용하여 삭제한다. function deleteItem() { parent.removeChild(parent.childNodes[1]); } parent.removeChild(parent.자식요소) See the Pen Untitled by byeolyoon (@byeolyoon) on CodePen. 자바스크립트 문법 (9) HTML 요소의 선택 document.getElementsByTagName(태그이름) 해당 태그 이름의 요소를 모두 선택함. document.getElementById(아이디) 해당 아이디의 요소를 선택함. document.getElementsByClassName(클래스이름) 해당 클래스에 속한 요소를 모두 선택함. document.getElementsByName(name속성값) 해당 name 속성값을 가지는 요소를 모두 선택함. document.querySelectorAll(선택자) 해당 선택자로 선택되는 요소를 모두 선택함. HTML 요소의 생성 document.createElement(HTML요소) 지정된 HTML 요소를 생성함. document.write(텍스트) HTML 출력 스트림을 통해 텍스.. 자바스크립트 문법 (8) 전역 객체(global object) 자바스크립트에 미리 정의된 객체로 전역 프로퍼티나 전역 함수를 담는 공간의 역할 전역범위에서 this 연산자를 통해 접근할 수 있음 래퍼 객체(wrapper object) 숫자, 문자열, 불리언 등 원시 타입의 프로퍼티에 접근하려고 할 때 생성되는 임시 객체를 래퍼 객체라고 함. var str = "문자열"; var strObj = new String(str); document.write(str.length + " "); document.write((str == strObj) + " " ); document.write((str === strObj) + " " ); document.write(typeof str + " "); document.write(typeof st.. 자바스크립트 문법 (7) 자바스크립트의 기본 타입은 객체(object)입니다. 객체란 이름(name)과 값(value)으로 구성된 프로퍼티의 정렬되지 않은 집합 var cat = "나비"; var kitty = { name:"나비", family:"코리안 숏 헤어", "age":1, weight:"1kg"}; document.write(cat + " ") document.write(kitty.name); //나비 나비 var person = { name: "홍길동", birthday: "030219", pld : "1234567", fulld : function(){ return this.birthday + this.pld; } }; document.write(person.name + " ") document.write(pers.. 자바스크립트 문법 (6) 함수의 기초 js에서 함수는 문법적 구문일뿐만 아니라 값이기도 함 따라서 함수가 변수에 대입될 수도 있으며, 다른 함수의 인수로 전달될 수도 있음 function sqr(x) { return x * x; } var sqrNum = sqr; document.write(sqr(4) + " "); document.write(sqrNum(4)); function localNum(){ var num = 10; document.write("함수 내부에서 변수 num의 타입은" + typeof num + "입니다. " ); } localNum(); document.write("함수의 호출이 끝난 뒤 변수 num의 타입은" + typeof num +"입니다."); //함수 내부에서 변수 num의 타입은number입니다.. 자바스크립트 문법 (5) var arrLit = [1,true,"Javascript"]; var arrObj = Array(1,true,"Javascript"); var arrNewObj = new Array(1,true,"Javascript"); document.write(arrLit + " "); document.write(arrObj + " "); document.write(arrNewObj + " "); var arr = ["Javascript"]; var element = arr[0]; arr[1] = 10; arr[2] = element; document.write("배열 arr의 요소에는 [" + arr + "]가 있습니다. "); document.write("배열 arr의 길이는 " + arr.length + "입.. 자바스크립트 문법 (4) 조건문 See the Pen Untitled by byeolyoon (@byeolyoon) on CodePen. case 를 이용한 예제 See the Pen Untitled by byeolyoon (@byeolyoon) on CodePen. var i = 1, j = 1; while(i > 3) { document.write("i: " + (i++) + " "); } do { document.write("j:" + (j++) + " "); } while(j > 3); // j : 1 while 문과 do/while 문의 차이점 while문 거짓이라면(조건에 부합 X) 단 한번도 실행하지 않음 do/while문 한번은 실행하고 루프를 빠져나옴 for(var i = 1; i < 10; i++){ docum.. 자바스크립트 문법(3) 연산자 See the Pen Untitled by byeolyoon (@byeolyoon) on CodePen. 위의 예제처럼 void 연산자는 정의되지 않은 원시 타입의 값을 얻기 위해 void(0)과 같은 형태로 종종 사용됩니다. 이전 1 2 다음