728x90
일반태그는 output만 내보냄
-> .innerHTML로 접근
form태그는 input을 허용하고 out도 내보냄
-> .value로 접근
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<p id="demo">p tag id demo</p> <!-- 일반태그(output) -->
<input type="text" id="text" value="" size="20"> <!-- form태그(input, output) -->
<br>
<input type="button" value="input button" onclick="btnclick()">
<br>
<script type="text/javascript">
function btnclick(){
alert("btnclick() 호출");
document.getElementById("demo").innerHTML="버튼이 클릭됨!!"; //일반태그의 값은 innerhtml을 쓴다
let text = document.getElementById("text").value; //setter 폼태그는 value라고쓴다
alert("text:"+text); //확인
document.getElementById("text").value = "World"; //getter 내보내줄때
}
</script>
<br><br>
<input type="button" value="input button" onclick="btnfunc(1)">
<br>
<button type="button" onclick="">button tag</button>
<script type="text/javascript">
function btnfunc(num){
let name;
name = 'input button click';
if(num == 1){
}else{
name = 'button tag click';
}
alert(name);
document.getElementById("demo").innerHTML = sum(3, 6);
document.getElementById("text").value = sum(3, 6);
}
function sum(x,y) {
return x * y;
}
</script>
<br><br>
입력:<input type="text" id="num" value="123">
<br><br>
<button type="button" onclick="inputclick()">클릭</button>
<script type="text/javascript">
function inputclick(){
let num = document.getElementById("num").value;
document.getElementById("num").value = parseInt(num) + 3;
}
</script>
</body>
</html>
'🚀 자바 스크립트 JavaScript' 카테고리의 다른 글
| 자바 스크립트 기초 문제/풀이 - 1️⃣ 📝 (0) | 2021.03.02 |
|---|---|
| 5️⃣ 자바 스크립트 Date (0) | 2021.03.02 |
| 3️⃣ 자바스크립트의 변수 var , let , const + ( foreach와 생성자 사용법 ) (0) | 2021.03.02 |
| 2️⃣ 자바 스크립트 Inline , Internal , external 방식 (0) | 2021.03.02 |
| 1️⃣ 자바 스크립트 입문 (0) | 2021.03.02 |
댓글