yoon's Devlog

C언어와 동일하기 떄문에 예제만 살펴보고 넘어가보도록 하겠다. 예제1 - 단일 if문 if문을 활용하여 isFun 이 참일 때 p에' "좋아요!" 출력하기 예제2 - 비교연산자를 활용하여 if문 사용해보기 문제는 주석에 체크하기 예제3 - else문 문제는 주석에 체크하기 예제4 - else if 문 문제는 주석에 성적 확인

자바스크립트에서 반복문을 수행하는 방법으로 for문에 대해 공부해봤었다. 이번에는 반복문을 수행하는 또 다른 방법인 forEach문에 대해 공부해보도록 하겠다. forEach문은 함수를 인자로 전달한다 . 다음 예제의 주석을 읽어보자. nums.forEach(function(item, index){}); 예제1 forEach의 함수 내 인자로는 item과 index를 활용한다. 결과 예제2 - forEach 함수를 이용하여 버튼 클릭 시 p 요소의 innerText값 변경하기 배열의 forEach()함수를 활용한 반복 작업 p1 p2 p3 p4 p5 바꾸기

고양이 강아지 코끼리 하나 두울

다음은 box 클래스의 스타일을 지정하고, 추가로 특정 요소의 스타일을 따로 지정하는 예제이다. 클래스의 스타일 지정은 태그 내에서, ".클래스명"{}으로 지정한다. 특정 요소의 스타일 지정방법에는 두가지가 있다. [특정 요소 스타일 지정하기] 1. 사용할 요소에서 바로 사용하기 div1 2. id를 사용하기 document.querySelector("#myDiv").addEventListener("mousedown",function(){ //-를 쓰면 산술연산자로 인식하여 원하는대로 나오지 않으므로 카멜 케이스를 사용한다 document.querySelector("#myDiv").style.backgroundColor = "yellow"; }); [좌표 활용하기] 객체 내의 좌표를 얻어내는 방법은 다음..

자바스크립트에서의 반복문은 C언어와 유사하다. for(let i = 0 ; i

document.querySelectorAll("div") 은 각 div의 참조값을 담은 배열이다. 다음 구조가 여러번 쓰일 때, stack에 document.querySelectorAll("div") 배열의 참조값을 저장한 변수 divs를 만들어 더 편리하게 사용할 수 있다.

emmet 축약어를 이용하여 마크업을 편리하게 할 수 있다. 자세한 사항들은 emmet.io에서 확인할 수 있다.

다음 예제는 클릭 시 어떠한 기능이 자동으로 수행되도록 구현하는 예제이다. 이벤트 처리 방법에는 다음 예제에 나와있는 두가지 방법이 있다. 첫번째 방법 ) 사용하기. 이벤트 처리 눌러보셈 두번째 방법 ) id와 .addEventListener 사용하기 이벤트 처리 눌러보셈2 document.querySelector("#아이디이름").addEventListener(이벤트명,콜백함수 function(){ }); 주로 두번째 방법을 많이 이용하므로 위의 코드를 통째로 외우는 것이 좋다. 여기서 콜백함수란, 전달만 해놓으면 나중에 특정시점에 알아서 호출되는 함수이다. 예제1은 클릭 시 함수가 실행되도록 구현한 예제로, 위의 두 방법을 모두 사용해본 예제이다. 똑같은 오브젝트가 여러개일 때에는, document...