์ ๊ฒฐ๊ณผ๊ฐ์ด ์๋์ค๋์ง ์์ ์์๊น์? let๋์ var๋ฅผ ์จ๋ ์๋์ค๋ค์ใ
ใ
const rateBtn = document.getElementById("#rate-btn"); getElementById๋ฅผ ์ฐ์
จ๊ธฐ ๋๋ฌธ์ ๋ค์ชฝ ์๊ดํธ ์์๋ #๋ฅผ ๋นผ๊ณ rate-btn๋ง ์์ฑํด์ฃผ์
์ผ ์ ํ์ด ์ ๋๋ก ๋ฉ๋๋ค. ์์ ๋ง์ ํด์ฃผ์ ๊ฒ์ฒ๋ผ onclick ์ฌ์ฉ์ ํด๋น ์ ์ธ์ด ๋ถํ์ํ์ฌ ์ค๋ฅ๊ฐ ๋์ง ์์ง๋ง, rateBtn ์ ์ฌ์ฉํ์ค๊ฑฐ๋ฉด ๊ทธ๋ ๊ฒ ์์ฑํ์๋ฉด ์ข์ ๊ฒ ๊ฐ์ต๋๋ค. ์์ฒ๋ผ ์์ฑ ํ console์ rateBtn ์ฐ์ผ์๋ฉด null๋ก ๋์์! #rate-btn์ ์์ฑํ์ค๊ฑฐ๋ผ๋ฉด querySelector๋ฅผ ์์ฑํ๋ ๋ฐฉ๋ฒ๋ ์์ต๋๋ค. onclick ์ฌ์ฉ ์์ด ์ฝ๋๋ฅผ ์์ฑํด๋ดค์ต๋๋ค. script> const rateBtn = document.getElementById("rate-btn"); const showPrice = () => { //์ฌ์ฉ์๊ฐ ์
๋ ฅํ ๊ฐ์ ๋๊ฐ์ ๋ณ์์ ์ ์ฅํจ let original = document.querySelector("#original").value; let rate = document.querySelector("#rate").value; if (original > 0 && rate > 0) { var savedPrice = original * (rate / 100); var resultPrice = original - savedPrice; } document.querySelector(".show-result").innerHTML = "์ํ์ ์๋ ๊ฐ๊ฒฉ์" + original + "์์ด๊ณ , ํ ์ธ์จ์" + rate + "%์
๋๋ค." + savedPrice + "์์ ํ ์ธ๋ฐ์" + resultPrice + "์์ ๊ตฌ๋งคํ์ค ์ ์์ต๋๋ค."; }; rateBtn.addEventListener("click", showPrice) script> ์ ๋ ๊ฐ์ ํ์์ด๋ผ ๋์ ๋์
จ๊ธธ ๋ฐ๋ผ์!