<!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">
<title>할인율</title>
</head>
<body>
<form action="">
가격 : <input type="text" id="price"> 원 <br>
할인율 : <input type="text" id="dis"> % <br>
<button type="button" onclick="calc();"> 할인가격 계산 </button>
</form>
<h3 id="print">
<!-- ex) 50000원 5%할인 2500원 -->
</h3>
<script>
function calc(){
let price = document.getElementById('price').value;
let dis = document.getElementById('dis').value;
let disPrice = price * (dis/100);
let payPrice = price - disPrice;
price = Number(price);
dis = Number(dis);
document.getElementById('print').innerText =
`가격: ${price}원 , 할인율: ${dis}%,
할인금액: ${disPrice}원, 지불금액 ${payPrice}원 `;
}
</script>
</body>
</html>
'JS > JS 예시' 카테고리의 다른 글
| [JS] 로그인 폼 (회원가입시에도 사용) (0) | 2023.04.25 |
|---|---|
| [JS] 여행 준비물 점검 목록 (버튼으로 추가, 삭제하기) (0) | 2023.04.21 |
| [JS] 구구단 ( 문제 출력 -> 맞추기 -> 결과 출력 ) (0) | 2023.04.20 |
| [JS] json으로 값을 받아와서 원하는 모양을 나눠 출력 (0) | 2023.04.20 |
| [JS] 데이터를 받아와서 원하는 모양으로 출력 (json) (0) | 2023.04.20 |