- 계산기 만들어보기
<body>
<h2>계산기</h2>
number1: <input type="text" id="id1" name="id1"> <br>
number2: <input type="text" id="id2" name="id2"> <br>
계산결과: <input type="text" id="result1" name="result1"><br>
<input type="button" value="계산" onclick="fun1()">
</body>
<script>
const fun1 = () => {
const num1 = document.getElementById('id1');
console.log(num1.value);
const num2 = document.getElementById('id2');
console.log(num2.value);
const num3 = document.getElementById('result1');
num3.value = Number(num1.value) + Number(num2.value);
}
</script>02_dom_input_02.html
0.00MB
- 학점관리 프로그램 만들기
<body>
JAVA 성적: <input type="text" id="id1" name="id1"><br>
html 성적: <input type="text" id="id2" name="id2"><br>
학점: <input type="text" id="result1" name="result1"><br>
<h1 id="id3"></h1>
<input type="button" value="학점계산" onclick="fun1()">
</body>
<script>
const fun1 = () => {
const num1 = document.getElementById('id1');
const num2 = document.getElementById('id2');
const num3 = document.getElementById('result1');
const num4 = document.getElementById('id3');
const avg = (Number(num1.value) + Number(num2.value)) / 2;
if (avg >= 90) {
num3.value = "A";
num4.innerHTML = "당신의 학점은 A입니다";
} else if (avg >= 80) {
num3.value = "B";
num4.innerHTML = "당신의 학점은 B입니다";
} else if (avg >= 70) {
num3.value = "C";
num4.innerHTML = "당신의 학점은 C입니다";
} else if (avg >= 60) {
num3.value = "D";
num4.innerHTML = "당신의 학점은 D입니다";
} else {
num3.value = "F";
num4.innerHTML = "당신의 학점은 F입니다";
}
}
</script>02_dom_input_03.html
0.00MB
'나의 수업일지' 카테고리의 다른 글
- 계산기 만들어보기
<body>
<h2>계산기</h2>
number1: <input type="text" id="id1" name="id1"> <br>
number2: <input type="text" id="id2" name="id2"> <br>
계산결과: <input type="text" id="result1" name="result1"><br>
<input type="button" value="계산" onclick="fun1()">
</body>
<script>
const fun1 = () => {
const num1 = document.getElementById('id1');
console.log(num1.value);
const num2 = document.getElementById('id2');
console.log(num2.value);
const num3 = document.getElementById('result1');
num3.value = Number(num1.value) + Number(num2.value);
}
</script>02_dom_input_02.html
0.00MB
- 학점관리 프로그램 만들기
<body>
JAVA 성적: <input type="text" id="id1" name="id1"><br>
html 성적: <input type="text" id="id2" name="id2"><br>
학점: <input type="text" id="result1" name="result1"><br>
<h1 id="id3"></h1>
<input type="button" value="학점계산" onclick="fun1()">
</body>
<script>
const fun1 = () => {
const num1 = document.getElementById('id1');
const num2 = document.getElementById('id2');
const num3 = document.getElementById('result1');
const num4 = document.getElementById('id3');
const avg = (Number(num1.value) + Number(num2.value)) / 2;
if (avg >= 90) {
num3.value = "A";
num4.innerHTML = "당신의 학점은 A입니다";
} else if (avg >= 80) {
num3.value = "B";
num4.innerHTML = "당신의 학점은 B입니다";
} else if (avg >= 70) {
num3.value = "C";
num4.innerHTML = "당신의 학점은 C입니다";
} else if (avg >= 60) {
num3.value = "D";
num4.innerHTML = "당신의 학점은 D입니다";
} else {
num3.value = "F";
num4.innerHTML = "당신의 학점은 F입니다";
}
}
</script>02_dom_input_03.html
0.00MB
