본문 바로가기

Language/Javascript14

[Javascript] Javascript 입문 10 (170321) Javascript 입문 10 Dynamic Dom- 원하는 시점에 동적인 객체를 만들어 넣어야 할 때 DynamicDom을 이용한다.- DOM : Document Object Model createElement 이용하여 동적으로 객체 추가하기1. document.createElement("객체명"); 을 이용하여 참조값을 담는다.2. 만들어진 문서객체에 텍스트를 출력한다. (innerText 이용)3. 객체를 넣을 body의 참조값을 담는다.4. append함수를 이용하여 만들어진 div를 추가한다.- append : 객체를 자식요소로 맨 뒤에 추가한다.- prepend : 객체를 자식요소로 맨 앞에 추가한다. 동적 객체 추가 + 속성 추가하기- setAttribute(속성명, 속성값) 사용 응용1 :.. 2017. 3. 21.
[Javascript] Javascript 입문 09 (170320) Javascript 입문 09 forEach(function(){ });- ( ) 안의 값을 전달하는 역할- 배열의 .forEach() 함수를 호출하면서 전달한 함수는 배열의 방의 갯수만큼 자동 호출된다.- 전달한 함수의 첫번째 인자는 배열에 저장된 아이템이 전달된다.- 전달한 함수의 두번째 인자로 배열의 index 가 전달된다. **출력결과** for문의 줄임- for(var i in names) { } ** 출력 결과 ** CSS 색상 - 빛을 기준으로 짜였다.- 10진수의 경우 99가 최대수- 16진수의 경우 ff가 최대수- 빨(R) 녹(G) 파(B) 의 농도 16진수 두자리 - #ff 00 00 빨 -> rgb(255, 0, 0)- #00 ff 00 녹->rgb(0, 255, 0)- #00 00 .. 2017. 3. 20.
[Javascript] Javascript 입문 08 (170320) Javascript 입문 08 조건문 if- if ( 조건 ) { } 형태- { }안에 수행할 script가 1줄이라면 { }를 안써도 무관하다. confirm - yes or no 창 if문을 이용한 응용 1 [cofirm창의 버튼에 따라 결과 값 다르게 출력] **출력결과** if문을 이용한 응용2 [p태그를 두어 console문장이 p태그 속에 뜨게 하기] **출력결과** if문을 이용한 응용3 [중복값 묶어서 편리하게 이용하기] if문을 이용한 응용4 [여러개의 조건으로 나누기] **출력결과** - 조건을 작성할 때 (90 **출력 결과** 2017. 3. 20.
[Javascript] Javascript 입문 07 (170316) Javascript 입문 07 Global 영역 변수 선언의 문제점- global 영역에 변수를 선언하면 자바스크립트로 조작하여 이용가능- 변수가 중복될 수 있다.- 협업하기 쉽지 않다. function 생성 시 onclick 기능보다 addEventListener를 많이 사용하는 이유- onclick 이용 시 함수를 global 영역에 만들 수 밖에 없다. 이럴 경우 앞서 언급한 문제점이 나타난다.- addEventListener를 이용할 경우 addEventListener("click", function(){ }); 에서 function안에 입력하기 때문에 변수를 선언하면 function 외부에서는 참조가 불가능하다. QUIZ > 버튼을 누르면 누른 횟수가 count되도록 해보세요. ANSWER > .. 2017. 3. 16.