[노마드코더] 바닐라 JS로 크롬 앱 만들기 #05 (quotes, background)

Math.random() : 랜덤한 숫자

Math.ceil() : 올림

Math.round() : 반올림

Math:floor() : 내림

---

랜덤하게 노래 / 가수 제목 표시하기 ( Quotes 대신)

const quotes = [
  {
    title : "꽃길만 걷자",
    singer : "버블 사운드"
  },
  {
    title : "있잖아",
    singer : "데이식스"
  },
  {
    title : "너를 생각해",
    singer : "주시크"
  },
  {
    title : "savage",
    singer : "aespa"
  },
  {
    title : "My Universe",
    singer : "방탄소년단"
  },
  {
    title : "나의 첫사랑",
    singer : "다비치"
  },
  {
    title : "Only You",
    singer : "이민혁"
  },
  {
    title : "취소해",
    singer : "한요한"
  },
  {
    title : "OHAYO MY NIGHT",
    singer : "디핵 (D-Hack)& PATEKO"
  },
  {
    title : "얼마나 널 사랑하고 있는지 (With 정해일)",
    singer : "새봄"
  }

]

const title = document.querySelector("#quotes span:first-child");
const singer = document.querySelector("#quotes span:last-child");

const todaysQuote = quotes[Math.floor(Math.random() * quotes.length)];
// 배열은 0부터 시작하는 것 잊지말기!

title.innerText = todaysQuote.title;
singer.innerText = todaysQuote.singer;

---

랜덤한 배경화면

const images = ["0.jpg", "1.jpg", "2.jpg"]
// 저장된 이름하고 똑같이 맞춰줄 것

const chosenImage = images[Math.floor(Math.random()*images.length)]
const bgImage = document.createElement("img");
// js에서 html 요소 만들기 (우와)

bgImage.src=`img/${chosenImage}`
document.body.appendChild(bgImage); 
// img 를 body에 붙여주기
// append - 제일 뒤에 붙이기, prepend - 제일 앞에 붙이기