JiSoo's Devlog

Math.random()에 10을 곱하면 0에서 10 사이의 숫자 얻을 수 있다 floor 내림 ceil 올림 const todaysQuote = quotes[Math.floor(Math.random() * quotes.length)]; quote.innerText = todaysQuote.quote; author.innerText = todaysQuote.author; 이렇게 html로 만들어야 하는 것을 const images = ["0.jpg", "1.jpg", "2.jpg"]; const chosenImage = images[Math.floor(Math.random() * images.length)]; const bgImage = document.createElement("img"); consol..

interval은 매번 일어나야 하는 무언가 const clock = document.querySelector("h2#clock"); function sayHello() { console.log("hello"); } setInterval(sayHello, 5000); setInterval은 호출하려는 함수의 이름, 매 호출 사이의 시간을 인자로 써주면 된다 설정한 시간마다 반복된다 setTimeout(sayHello, 5000); setTimeout은 설정한 시간만큼 기다렸다가 한 번만 실행 function getClock() { const date = new Date(); console.log(`${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}..

querySelector 사용할 때는 대상이 id 인지 명확히 해줘야 한다 → querySelector("#login-form") 왜냐면 classname, tagname 모두 검색 가능하기 때문에 Log In const loginInput = document.querySelector("#login-form input"); const loginButton = document.querySelector("#login-form button"); function onLoginBtnClick() { console.log(loginInput.value); } loginButton.addEventListener("click", onLoginBtnClick); input의 유효성 검사를 작동시키기 위해서는 input이..

JavaScript는 HTML을 읽어올 뿐만 아니라 변경도 가능 브라우저가 우리에게 많은 게 들어있는 document 객체를 준다 JavaScript로 정보를 가지고 올 수 있는 방법은 document 객체와 element를 가져오는 함수 사용하는 것 console.dir()은 element를 더 자세히 보여준다 const title = document.getElementById("title"); console.dir(title); JavaScript는 HTML element를 가지고 오지만 HTML 자체를 보여주는 게 아니라 HTML을 표현하는 object를 보여준다 getElementById 함수를 통해 id로 element를 가져올 수 있고 변경도 가능하다 innerText, className, a..

자바스크립트는 모든 브라우저에 내장되어 있고 프론트엔드 개발자가 사용할 수 있는 유일한 프로그래밍 언어 ! 브라우저가 HTML을 열고 HTML은 CSS와 자바스크립트를 가져오는 것 자바스크립트는 위에서 아래로 읽는다 VSCode에서 [파일] -> [폴더 열기] ->[MOMENTUM] 폴더 열기 ** 파일 생성 시 오류가 뜬다면 VSCode 속성을 관리자 권한으로 변경 두 엔진 동시 실행(CSS, JavaScript) alert("hi"); 자바스크립트에는 type이 있고 알아서 이해한다 Number : 정수(Integer), 실수(float) String : 처음부터 끝까지 문자로 이루어져 있다 "hello " + "my name is jisoo"→ "hello my name is jisoo" conso..