겉바속촉
[html] function 여러개 만들어서 가져오기 본문
728x90
반응형
fucntion을 여러개 만들어서 alert창으로 확인해볼게요:)
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<style type="text/css">
#out {
position: absolute;
left: 20px;
top: 100px;
background-color: #800000;
padding: 10 10 10 10;
width: 300px;
height: 100px;
}
</style>
<script type="text/javascript">
/* alert1 */
function test1(a) {
alert(a+100);
}
function test2(str){
alert("문자열["+str+"]을 받았어요")
}
function test3() {
var s=confirm("데이터를 추가할까요?");
if(a==1)
out.innerHTML='추가됐어요';
else
out.innerHTML='취소했어요';
}
function test4() {
var s=prompt("너의 이름은 모니?");
out.innerHTML="저의 이름은"+s.fontcolor('cyan')+"입니다";
}
</script>
</head>
<body>
<input type="button" value="alert" onclick="test1(123)">
<input type="button" value="alert" onclick="test2('HELLO')">
<input type="button" value="confirm" onclick="test3()">
<input type="button" value="prompt" onclick="test4()">
<div id="out"></div>
</body>
</html>
컴파일 해보시면 다음과 같이 뜹니다:)
<body>사이에 우리가 button타입으로 주었기 때문에 클릭 가능한 것들이쥬?
value값에 넣어 준 값들이 버튼에 들어가 있구요!!
onclick에 지정해준 함수들이 잘 작동되는 지
하나씩 눌러봅시다!
첫번째 alert 누르면 --> test1 함수가 작동되는 데 123을 넣은 결과가 도출됩니다:)
두번째 alert 누르면 --> test2 함수가 작동되는 데 문자열 str인 HELLO를 넣은 결과가 도출됩니다:)
세번째 confirm 누르면 --> test3 함수가 작동되는 데 이 함수는 confirm창이 뜨도록 되어 있습니다
확인 버튼을 누르면 = 추가됐어요
취소 버튼을 누르면 = 취소했어요
네번째 prompt누르면 --> test4 함수가 작동되는 데 prompt창이 뜨도록 되어있습니다:)
그래서 값을 입력한 후 확인을 누르면
그 값 = s라고 봐주시면 됩니다
그래서 코드에서 작성해준 대로
out.innerHTML이 잘 나오는 지 확인해주세요:)
잘 나왔다면 성공 !^^!
728x90
반응형
'IT일기(하반기) > HTML' 카테고리의 다른 글
| [html] Array test (0) | 2020.06.12 |
|---|---|
| [html] olul연습하기 (0) | 2020.06.12 |
| [html] onchange로 페이지이동하기 (0) | 2020.06.11 |
| [html] 마우스 이벤트 객체, id값 지정한곳에 출력 (0) | 2020.06.11 |
| [html] 자바스크립트- popup창 생성하기 (0) | 2020.06.11 |
'IT일기(하반기)/HTML' Related Articles
more
