목록JS (43)
한 걸음씩
버튼을 클릭할 때마다 배경색이 랜덤으로 바뀌는데 배경색에 그라데이션 효과를 줄 것! const colors = [ "#ef5777", "#575fcf", "#4bcffa", "#34e7e4", "#0be881", "#f53b57", "#3c40c6", "#0fbcf9", "#00d8d6", "#05c46b", "#ffc048", "#ffdd59", "#ff5e57", "#d2dae2", "#485460", "#ffa801", "#ffd32a", "#ff3f34" ]; // 버튼을 클릭하면 배경 색상 변경 const btn = document.querySelector("button"); const body = document.querySelector("body"); function giveMeColor()..
function todayTimes(){ // 현재 시간 생성 const today = new Date() // 올해연도 기준 크리스마스 const christmas = new Date(`${today.getFullYear()}-12-25:00:00:00+0900`) // 크리스마스까지 남은 일수 const timeDiff = christmas - today // 밀리초를 초단위로 변경 // 1000: 밀리초, 60: 1분, 60: 1시간, 24: 1일 const days = String(Math.floor(timeDiff / (1000 * 60 * 60 * 24))).padStart(2,"0"); // 남은 일 const hours = String(Math.floor((timeDiff % (1000 *..
[게임 진행 순서] 1. 0부터 어디까지 랜덤 수를 고를지 입력한다 2. 사용자가 맞출 수를 입력 후 play버튼을 누른다 3. 컴퓨터가 랜덤으로 뽑은 수와 사용자가 맞춘 수를 비교한다 4. 사용자가 맞추면 win, 아니라면 lost [조건] 1. 0에서 사용자가 지정한 숫자까지의 범위에서 랜덤 한 숫자를 찾으세요. (범위는 0 이상 입력값 이하가 됩니다.) 2. 범위에는 음수가 포함될 수 없습니다. 3. 실시간으로 범위 값을 업데이트해야 합니다. 4. 유저가 숫자를 선택한 후에 게임을 플레이할 수 있습니다. 5. 유저에게 게임의 승패를 알려야 합니다. html >>> Random Number Game Generate a number between 0 and Guess the number: Play! Y..
Q. preventDefault는 왜 사용하고, action과 무슨 차이점이 있을까? A. action 속성을 사용한 폼에서 입력을 하고 제출을 하면, 입력된 데이터가 지정된 페이지로 이동해서 백엔드에서 처리를 한다. 간단히 말해서, 제출된 폼 데이터를 가지고 다른 페이지로 넘긴다!! // action 속성을 사용한 로그인 폼 // 입력을 하고 제출을 하면 입력된 데이터가 '/login' 페이지로 이동해서 로그인 처리를 한다 A. preventDefault는 폼에서 입력을 하고 제출을 하더라도 다른 페이지로 넘어가지 않고 입력된 데이터를 가지고 추가적인 동작(또는 데이터 가공)을 수행을 한 후 다른 페이지로 넘기는 데 사용된다! AJAX 부분은 아직 안 배워서 pass
▷ 다음과 같은 HTML 문서가 있다고 가정해 보자. 사과 바나나 딸기 ▶ getElementsByTagName 특정 태그 이름을 가진 요소를 선택하는 간단하고 유용한 메서드 하지만, 'HTMLCollection'은 실시간으로 업데이트 되지 않으므로, 나중에 추가된 요소를 포함하려면 다시 메서드를 호출해야 함. const listItems = document.getElementsByTagName('li'); console.log(listItems); → 'li' 태그를 가진 모든 요소가 반환되는데, 이를 'HTMLCollection'으로 나타낸다. → 여기서 "HTMLCollection'은 배열 유사 객체이고 배열과 유사한 방식으로 요소에 접근할 수 있다. console.log(listItems[0].t..