먼저 quote와 author의 세트를 quote.js파일로 만든다.
html에 공간을 만들어 둔다.
<div id="quote">
<span></span>
<span></span>
</div>
그리고 quotes.js를 html에 불러온다.
<script src="quote.js"></script>
quotes.js에서 html의 quotes 영역을 선택한다.
const quote = document.querySelector("#quote span:first-child");
const author = document.querySelector("#quote span:last-child");
그다음에, quotes의 array에서 랜덤한 것을 선택하기 위해
Math.random()을 이용한다.
const todaysQuote = quotes[Math.floor(Math.random()*quotes.length)];
그리고 html에 quote와 author을 넣어주기 위해
아까 설정한 quote에 innerText 속성으로 오늘의 quote에 quote, author을 할당해준다.
quote.innerText = todaysQuote.quote;
author.innerText = todaysQuote.author;
마지막에 uncaught syntax error로 quote와 author가 이미 사용되었다고 나와서 애먹었다.
아무리 array안에 있어도 중복되면 안되나보다. 변수명은 다른 이름으로 지어주는게 좋겠다.