* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.
* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.
분명히 강의 내용과 똑같이
let url = "https://api.quotable.io/random";
fetch(url).then(res => res.json()).then(data => {
console.log(data);
let author = data['author'];
let content = data['content'];
let authorMsg = `- ${author} -`;
let contentMsg = `" ${content} "`;
$('#quoteAuthor').text(authorMsg);
$('#quoteContent').text(contentMsg);
});
이렇게 맞게 잘 들어간거 같은데요.
이상하게 quoteContent 부분만 읽어오지를 못하네요?
그런데 오른쪽 콘솔창에서는 분명 잘 읽어오는게 보이거든요?
근데 왜 콘텐츠 부분만 표시가 안되는지 모르겟어요.
보고 계신 화면 전체를 캡처해 주시면, 튜터님들이 빠르게 상황을 이해할 수 있어요.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script
src="https://code.jquery.com/jquery-3.7.1.js"
integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4="
crossorigin="anonymous"
></script>
<title>Document</title>
<script>
function 현재시간표시() {
let 현재시간 = new Date();
let 시 = 현재시간.getHours();
let 분 = 현재시간.getMinutes();
let 초 = 현재시간.getSeconds();
시 = 시 < 10 ? "0" + 시 : 시;
분 = 분 < 10 ? "0" + 분 : 분;
초 = 초 < 10 ? "0" + 초 : 초;
let temp_html = `<h1>${시}:${분}:${초}</h1>`;
$("#time").html(temp_html);
// 정각 1분 전에 시간을 빨강색으로 표시
if (현재시간.getMinutes() > 58) {
$("#time").style.color = "red";
}
}
// 1초마다 시간을 업데이트
setInterval(현재시간표시, 1000);
let url = "https://api.quotable.io/random";
fetch(url).then(res => res.json()).then(data => {
console.log(data);
let author = data['author'];
let content = data['content'];
let authorMsg = `- ${author} -`;
let contentMsg = `" ${content} "`;
$('#quoteAuthor').text(authorMsg);
$('#quoteContent').text(contentMsg);
});
</script>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<nav class="navbar">
<img
src="https://s3.ap-northeast-2.amazonaws.com/materials.spartacodingclub.kr/webjong/images/sparta-logo.svg"
alt="sparta-logo"
/>
<div class="weather">
<img
src="https://ssl.gstatic.com/onebox/weather/64/partly_cloudy.png"
id="weather-icon"
/>
<p>날씨 맑음, 20ºC</p>
</div>
</nav>
<div class="container">
<div class="greating">
<h1>Hello, My name!</h1>
<div id="time"></div>
<div class="motto">
<h3>My life's motto</h3>
<h2>웃으면 행복해집니다.</h2>
</div>
</div>
<div class="footer">
<p id="quoteAuthor">- 작자 미상 -</p>
<p 1d="quoteContent">
멋진 명언입니다. 아이스크림을 먹으면 행복해져요.
</p>
</div>
</div>
</body>
</html>
