1. 명언 배열에서 가져오기
- index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<form class="login-form hidden" id="login-form">
<input
required
maxlength="15"
type="text"
placeholder="What is your name?" />
</form>
<h2 id="clock">00:00:00</h2>
<h1 class="hidden" id="greeting" ></h1>
<div id="quote">
<span></span>
<span></span>
</div>
<script src="js/greetings.js"></script>
<script src="js/clock.js"></script>
<script src="js/quotes.js"></script>
</body>
</html> - quote.js 만들기
const quotes = [
{
quote: "The only way to do great work is to love what you do.",
author: "Steve Jobs"
},
{
quote: "Life is what happens when you're busy making other plans.",
author: "John Lennon"
},
{
quote: "The purpose of our lives is to be happy.",
author: "Dalai Lama"
},
{
quote: "Get busy living or get busy dying.",
author: "Stephen King"
},
{
quote: "You have within you right now, everything you need to deal with whatever the world can throw at you.",
author: "Brian Tracy"
},
{
quote: "Believe you can and you're halfway there.",
author: "Theodore Roosevelt"
},
{
quote: "The best way to predict the future is to invent it.",
author: "Alan Kay"
},
{
quote: "Your time is limited, don't waste it living someone else's life.",
author: "Steve Jobs"
},
{
quote: "If life were predictable it would cease to be life, and be without flavor.",
author: "Eleanor Roosevelt"
},
{
quote: "In the end, we will remember not the words of our enemies, but the silence of our friends.",
author: "Martin Luther King Jr."
}
];
const quote = document.querySelector("#quote span:first-child");
const author = document.querySelector("#quote span:last-child");
console.log(quote[0]);
2. 난수 생성하기
Math.random() 
4. random으로 명언 조회하기
- quotes.js
const quotes = [
{
quote: "The only way to do great work is to love what you do.",
author: "Steve Jobs"
},
{
quote: "Life is what happens when you're busy making other plans.",
author: "John Lennon"
},
{
quote: "The purpose of our lives is to be happy.",
author: "Dalai Lama"
},
{
quote: "Get busy living or get busy dying.",
author: "Stephen King"
},
{
quote: "You have within you right now, everything you need to deal with whatever the world can throw at you.",
author: "Brian Tracy"
},
{
quote: "Believe you can and you're halfway there.",
author: "Theodore Roosevelt"
},
{
quote: "The best way to predict the future is to invent it.",
author: "Alan Kay"
},
{
quote: "Your time is limited, don't waste it living someone else's life.",
author: "Steve Jobs"
},
{
quote: "If life were predictable it would cease to be life, and be without flavor.",
author: "Eleanor Roosevelt"
},
{
quote: "In the end, we will remember not the words of our enemies, but the silence of our friends.",
author: "Martin Luther King Jr."
}
];
const quote = document.querySelector("#quote span:first-child");
const author = document.querySelector("#quote span:last-child");
console.log(quotes[Math.floor(Math.random() * 10)]);
5. 배열의 길이 안에서 랜덤 시키기
- quotes.js
const quotes = [
{
quote: "The only way to do great work is to love what you do.",
author: "Steve Jobs"
},
{
quote: "Life is what happens when you're busy making other plans.",
author: "John Lennon"
},
{
quote: "The purpose of our lives is to be happy.",
author: "Dalai Lama"
},
{
quote: "Get busy living or get busy dying.",
author: "Stephen King"
},
{
quote: "You have within you right now, everything you need to deal with whatever the world can throw at you.",
author: "Brian Tracy"
},
{
quote: "Believe you can and you're halfway there.",
author: "Theodore Roosevelt"
},
{
quote: "The best way to predict the future is to invent it.",
author: "Alan Kay"
},
{
quote: "Your time is limited, don't waste it living someone else's life.",
author: "Steve Jobs"
},
{
quote: "If life were predictable it would cease to be life, and be without flavor.",
author: "Eleanor Roosevelt"
},
{
quote: "In the end, we will remember not the words of our enemies, but the silence of our friends.",
author: "Martin Luther King Jr."
}
];
const quote = document.querySelector("#quote span:first-child");
const author = document.querySelector("#quote span:last-child");
console.log(quotes[Math.floor(Math.random() * quotes.length)]);
- 화면에 랜덤으로 명언 표시하기
- quotes.js
const quotes = [
{
quote: "The only way to do great work is to love what you do.",
author: "Steve Jobs"
},
{
quote: "Life is what happens when you're busy making other plans.",
author: "John Lennon"
},
{
quote: "The purpose of our lives is to be happy.",
author: "Dalai Lama"
},
{
quote: "Get busy living or get busy dying.",
author: "Stephen King"
},
{
quote: "You have within you right now, everything you need to deal with whatever the world can throw at you.",
author: "Brian Tracy"
},
{
quote: "Believe you can and you're halfway there.",
author: "Theodore Roosevelt"
},
{
quote: "The best way to predict the future is to invent it.",
author: "Alan Kay"
},
{
quote: "Your time is limited, don't waste it living someone else's life.",
author: "Steve Jobs"
},
{
quote: "If life were predictable it would cease to be life, and be without flavor.",
author: "Eleanor Roosevelt"
},
{
quote: "In the end, we will remember not the words of our enemies, but the silence of our friends.",
author: "Martin Luther King Jr."
}
];
const quote = document.querySelector("#quote span:first-child");
const author = document.querySelector("#quote span:last-child");
const todayQuote = quotes[Math.floor(Math.random() * quotes.length)];
quote.innerText = todayQuote.quote;
author.innerText = todayQuote.author;
Share article
