
문제 1
1) 텍스트박스와 프롬프트에 작성한 이름을 alert 으로 띄우는 문제이다.
form / input 과 alert( prompt ( ) ) 을 사용해준다.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h3><b>이름출력</b></h3>
<form name="frm1">
이름:<input type="text" name="names" value="">
<input type="button" name="sumit" value="확인" onclick="hi()">
<script>
function hi(){
var nam = prompt("이름을 입력하세요",frm1.names.value);
alert(nam+"님 어서오세요");
}
</script>
</form>
</body>
</html>
2) 자신이 프롬프트에 입력한 수까지의 홀수의 합과 입력한 수의 구구단을 alert 으로 출력하는 문제이다.
prompt 와 alert 그리고 for 문을 사용해서 풀어준다.
프롬프트를 페이지 열자마자 띄우는 방법은 window.onload = function 을 사용해준다
합계
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
window.onload =function num(){
var sum=prompt("정수를 입력하세요","");
var sum1=0;
for(var i =0;i<sum;i++){
if(i%2!==0)
{
document.write(i+" , ");
sum1+=i;
}
}
document.write("<p> 1부터 20까지의 홀수의 합" + sum1);
}
</script>
</body>
</html>
구구단
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
window.onload=function hi(){
var num=prompt("출력하고 싶은 단을 입력하세요","");
for (var i=1; i<10;i++ )
{
document.write("2*"+i+"="+i*2+"<br>");
}
}
</script>
</body>
</html>

문제2
1) 버튼을 사용하지 않고 a href 를 이용하여 script를 호출하여 alret을 띄우는 문제이다.
! 길이를 불러오는 부분은 lenght 가 아니라 length
커서 위치를 옮기는 방법은 document.옮길 위치. focus( ); 하면 된다.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body><div styel="border='2'">
<table name="tab1" width="300" hight="300">
<form name="frm1">
<tr><td colspan="5"><center><h3><b>인터넷활용 Q&A</b></h3></center>
<tr>
<td>성명
<td colspan="3"><input type="text" name="nam" value="" width="100">
<tr> <td>제목
<td colspan="3"><input type="text" name="con" value="" width="200">
<tr>
<td>내용
<td colspan="3"><textarea value="" name="write" higth="150" width="350"></textarea>
<tr>
<td colspan="4"><center><a href="JavaScript:check();">저장</a></center>
</form>
</table>
</div>
<script>
function check(){
var content=document.frm1.con.value;
var len=document.frm1.nam.value;
if(len.length<2){
alert("성명은 두 글자 이상 입력해 주세요");
document.frm1.nam.focus();
}
else if(document.frm1.nam.value==""){
alert("성명을 입력해 주세요");
document.frm1.nam.focus();
}
else if(document.frm1.con.value==""){
alert("제목을 입력해주세요");
document.frm1.con.focus();
}
else if(document.frm1.write.value==""){
alert("내용을 입력해 주세요");
document.frm1.write.focus();
}
else
alert("["+content+"] 제목의 글이 입력되었습니다.")
}
</script>
</body>
</html>

문제 3
'HTML + CSS +JS' 카테고리의 다른 글
javascript란? (0) | 2021.05.30 |
---|---|
자바스크립트 객체 (0) | 2021.05.18 |