WEB (88) 썸네일형 리스트형 [JavaScript] setInterval / clearInterval / 일정시간 주기로 반복 작업하기 setInterval, clearInterval이란 무엇일까요? 😀 setInterval : 지정한 밀리초 주기마다 함수를 반복적으로 호출합니다. clearInterval : setInterval의 실행을 취소할 수 있습니다. 기본 문법 let timer = setInterval(function(){ document.querySelector("p").innerText = ++cnt; },1000); clearInterval(timer); See the Pen setTimeout by Lee-YuGyeong (@lee-yugyeong) on CodePen. 숫자세기 버튼을 누르면 1초마다 숫자가 세지고 멈추기 버튼을 누르면 실행이 멈추고 초기화됩니다. [JavaScript] setTimeout setTimeout이란 무엇일까요? 😯 의도적으로 지연하여 일정 시간 후에 특정 코드나 함수를 실행하고 싶을 때 사용합니다. setTimeout(호출될 함수, 지연시간); 지연시간은 밀리세컨드 단위로 1000 -> 1초를 의미합니다. 10초의 지연시간을 가지는 setTimeout setTimeout(function(){}, 10000); 이 예제는 10초뒤에 function을 실행합니다. javascript / 문자열을 만드는 세가지 방법 javascript에서 문자열을 만드는 세가지 방법 [JavaScript] insertAdjacentHTML 와 insertAdjacentElement 알아보기 / 인접한 영역에 추가하는 방법 insertAdjacentHTML 와 insertAdjacentElement 가 무엇일까요? insertAdjacentHTML와 insertAdjacentElement를 사용하면 특정 위치에 html과 노드를 삽입할 수 있습니다. 그 특정위치가 어딘데? 😧 코드는 자세히 보지 마세요! 밑에 설명되어있습니다. 위치만 봐주세요! beforebegin - 타겟 Element Node 바로 앞에 afterbegin - 타겟 Element Node의 첫번째 Text Node 앞에 beforeend - 타겟 Element Node의 마지막 Text Node 뒤에 afterend - 타겟 Element Node의 바로 뒤에 이때 예시의 특정 노드는 라는거 다들 눈치 채셨지요? 그럼 insertAdjacentHTML부.. [JavaScript] innerText 와 innerHTML 비교하기 innerText VS innerHTML innerText - 문자를 가져올때 html 태그를 문자로 인식 innerHTML - 문자를 가져올때 html 태그를 태그로 인식 읽기만하면 잘 이해가 되지 않으니 코드를 보면서 이해하자!! See the Pen Untitled by Lee-YuGyeong (@lee-yugyeong) on CodePen. See the Pen Untitled by Lee-YuGyeong (@lee-yugyeong) on CodePen. innerText는 daum"" target="_blank" rel="noopener">https://daum.net'>daum"를 문자열로 출력한다. innerHTML은 "daum"" target="_blank" rel="noopener">ht.. [JavaScript] this 내가 속해있는 그 객체의 참조값을 알려주는것이 this이다. 즉 this는 자기자신을 가리킨다! 그렇기 때문에 this는 어디에서 호출을 했는지 따라 값이 다르게 나온다. 로딩할때 this 변수안에 this let car1={ name:"소나타", drive:function(){ console.log(this); } }; 여기서 this는 자기자신의 참조값을 가리키기 때문에 car1.drive()를 출력하면 console.log(this)가 실행되어 car을 출력해준다. /* 위의 p 요소를 클릭하면 클릭한 바로 그 요소의 innerText를 clicked로 바꾸기 */ // 모든 p 요소의 참조값을 배열에 담아오기 let ps = document.querySelectorAll("p"); // 반복문 돌.. [JavaScript] HTML 요소 추가 / createElement 자바스크립트에서 동적으로 html요소를 추가하려면 밑의 양식처럼 하면된다. let p1 = document.createElement("p").innerText = "p1 입니다"; document.querySelector("#one").append("p1"); document.createElement("p") // document.createElement는 element의 참조값을 반환하여 , 라는 코드를 생성한다. let p = document.createElement("p") p.innerText = "p1 입니다"; 변수에 참조값을 가르키게 하고 innerText를 설정한다. document.querySelector("#one").append("p"); div의 id인 one을 찾은 뒤 append.. [JavaScript] 조건문 / if / else if / else if는 조건에 대한 ture, false를 나타내준다. C언어와 비슷하다. 예제 /* input 요소에 점수를 입력하고 체크하기 버튼을 눌렀을때 입력한 점수가 60점 이상이면 p요소에 "합격입니다."를 출력하고 60점 미만이면 "불합격입니다."를 출력해보세요. */ document.querySelector("#checkBtn").addEventListener("click",function(){ if(Number(document.querySelector("#jumsu").value)>=60){ document.querySelector("#result").innerText = "합격입니다." }else{ document.querySelector("#result").innerText = "불합격입니다." } .. 이전 1 ··· 5 6 7 8 9 10 11 다음
