검색결과 리스트
Java Script에 해당되는 글 44건
- 2011.08.28 간단한 계산기
- 2011.08.25 버튼-새창띄우기
- 2011.08.23 사용자가 입력한 내용으로 메시지 띄우기
- 2011.08.21 랜덤으로 추천사이트로 이동하기 버튼
- 2011.08.19 간단한 풀다운메뉴만들기
- 2011.08.16 history.go
- 2011.08.13 버튼 눌리면 경고메세지 보여주기
- 2011.08.10 리스트박스의 배경색으로 배경색바꾸기
- 2011.08.08 마우스 오른쪽 버튼 사용금지 3
- 2011.08.04 시간대별로 다른 인사 나타내기
글
간단한 계산기
안녕하세요?
오늘도 소스코드분석입니다. 지난번에 간단하게 계산하는 코드를 작성한적이 있는데요. 그거를 폼과 버튼들로 예쁘게 만들었네요. 간단한 계산기 코드입니다. 그럼 실행예를 볼까요?
이런식으로 맨앞에 첫수를 맨뒤에 두번째 수를 입력하고 +,-,X,,^ 버튼을 누르면 그 결과값이 오른쪽에 나타나게 하는 겁니다. 그럼 소스코드를 볼까요?
<script language="JavaScript">
<!--
function a_plus_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a+b
form.ans.value = c
}
function a_minus_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a-b
form.ans.value=c
}
function a_times_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a*b
form.ans.value=c
}
function a_div_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a/b
form.ans.value = c
}
function a_pow_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=Math.pow(a, b)
form.ans.value = c
}
// -->
</script>
<form name="formx"><input type=text size=4 value=12 name="a">
<input type="button" value=" + " onClick="a_plus_b(this.form)">
<input type="button" value=" - " onClick="a_minus_b(this.form)">
<input type="button" value=" x " onClick="a_times_b(this.form)">
<input type="button" value=" / " onClick="a_div_b(this.form)">
<input type="button" value=" ^ " onClick="a_pow_b(this.form)">
<input type="number" size=4 value=3 name="b"> = <input type "number" value=0 name="ans" size=9>
</form>
자바스크립트 부분부터 분석할까요? 하나만 분석하면 나머지는 계산부호만 다르니깐 이해하실겁니다.
function a_plus_b(form) {
a=eval(form.a.value)
b=eval(form.b.value)
c=a+b
form.ans.value = c
}
덧셈을 하는 부분인데요. 함수 이름은 a_plus_b이고 인수로 (form)즉 폼을 인수로 받습니다. 밑에서 onClick="a_plus_b(this,form)" 이렇게 폼을 전송하죠? 그 다음에 a=eval(form.a.value) 입니다. a에 폼에있는 name="a"라고 해놓은 type=text글상자 보이시죠? 거기에 있는 a의 값을 a라는 변수에 넣는 겁니다. 여기서 주의하실게 변수 a와 form.a의 a는 다른겁니다. 그다음에 다시 b에도 b의 값을 대입하구요. c=a+b라고 해서 c에 a와 b를 더한 값을 저장합니다. 그 다음에 form.ans.value=c에서 폼에있는 name="ans" 맨뒤에 있는 number숫자타입의 텍스트박스보이시죠. 그거 이름이 ans입니다. 거기에 value즉 값을 a+b를 한 c로 저장하라는 내용입니다.
나머지 뺄셈, 곱셈, 나눗셈등도 다 똑같습니다. 아래 폼은 설명 안해드려도 다 아시겠지요? 그럼 오늘은 여기까지 다음시간에 다시 만나요~
'Java Script' 카테고리의 다른 글
| textarea크기 조절하는 스크립트 (0) | 2011.09.01 |
|---|---|
| 간단한 디지탈 시계 (0) | 2011.08.30 |
| 버튼-새창띄우기 (0) | 2011.08.25 |
| 사용자가 입력한 내용으로 메시지 띄우기 (0) | 2011.08.23 |
| 랜덤으로 추천사이트로 이동하기 버튼 (0) | 2011.08.21 |
글
버튼-새창띄우기
안녕하세요?
오늘도 소스분석입니다. 오늘 소스는 버튼을 누르면 새창을 띄우는 소스입니다.
<script language="JavaScript">
<!--
function win() {
// 팝업창으로 사용할 크기와 위치, 그리고 내용을 아래에서 설정 합니다
msg=window.open("","msg","height=200,width=200,left=80,top=80"); // ("","윈도우이름","높이,가로,왼쪽
위치,위쪽위치")
msg.document.write("<html><title>Jasko Sample Script</title>");
msg.document.write("<body bgcolor='white' onblur=window.close()>");
msg.document.write("<center>이렇게 새창을 띄웁니다.</center>");
msg.document.write("</body></html><p>");
}
//-->
</script>
<form>
<input type="button" value="새창 열자" onclick="win()">
</form>
자바스크립트에 함수가 win()이라는 함수가 있습니다. 이 함수는 새창을 열어서 메세지를 띄우게 됩니다. window.open함수는 뒤에 나와있는 매개변수로 새창을 띄우는 함수입니다. 그 다음에 document.write는 뒤에 메시지를 html로 해석해서 표시하게 합니다. input type="button"에서 onclick시 win()함수를 호출하게 되어있습니다. 정리하면 폼을 만들어서 거기에 버튼이 하나 있습니다. 그 버튼위에는 새창열자라고 되어있고 클릭하면 자바스크립트의 win함수를 호출하게 됩니다. 그 win함수에서는 새창을 열어서 메시지를 띄우게 되는 것입니다.
이해하셨지요? 그럼 오늘은 여기까지 하겠습니다.
'Java Script' 카테고리의 다른 글
| 간단한 디지탈 시계 (0) | 2011.08.30 |
|---|---|
| 간단한 계산기 (0) | 2011.08.28 |
| 사용자가 입력한 내용으로 메시지 띄우기 (0) | 2011.08.23 |
| 랜덤으로 추천사이트로 이동하기 버튼 (0) | 2011.08.21 |
| 간단한 풀다운메뉴만들기 (0) | 2011.08.19 |
글
사용자가 입력한 내용으로 메시지 띄우기
안녕하세요?
오늘도 소스코드를 보며 분석해 보는 시간을 가지겠습니다. 오늘은 텍스트박스에 글자를 입력하고 버튼을 누르면 그 입력한 내용으로 경고메시지를 출력하는 소스입니다. 아래 소스를 함께 보시죠.
<script language="JavaScript">
<!--
function seeTextArea(form) {
alert(form.myarea.value);
}
// -->
</script>
<form name="myform">
<textarea name="myarea" cols="40" rows="5"></textarea>
<input type="button" name="button3" value="누르세요" onClick="seeTextArea(this.form)">
</form>
자바스크립트 소스에 함수가 하나 있습니다. seeTextArea인데요. 인자로 form을 받습니다. 이 form은 아래 form name="myfom"의 form입니다. 그래서 이 form에서 사용된 모든 컨트롤들을 제어할수 있습니다. 그다음에 alert함수가 나옵니다. 이건 배웠죠. 경고메시지를 표시하는거요. 뒤의 내용으로. 뒤의 내용을 보면 form.myarea.value입니다. 이말은 form의 myarea는 textarea name="myarea"로 되어있으니깐 textarea를 얘기하는거구요. value라고 하는 것은 그 textarea상자안에 쓰여져 있는 글자값을 얘기합니다. 예를들어 글상자안에 "안녕하세요" 이렇게 썼다면 value의값은 안녕하세요가 됩니다. 정리하면 textarea이름 myarea안의 값 value로 alert 경고창을 표시하라하는 것입니다.
아래에 있는 form에 texarea가 있고 밑에 button이 있는데 onClick즉 버튼을 눌렀을때 seeTextArea함수를 호출하는데 인자값으로 폼을 전송해야 겠지요? 그래서 this.form이라고 했습니다.
이해안가시는 부분이 있으신가요? 다들 이해하셨으리라 믿고 실행결과를 보면서 마치겠습니다. 그럼 다음시간에 또 만나요~
초기화면입니다. 글상자에 글을 입려하고 누르세요버튼을 누르면
'Java Script' 카테고리의 다른 글
| 간단한 계산기 (0) | 2011.08.28 |
|---|---|
| 버튼-새창띄우기 (0) | 2011.08.25 |
| 랜덤으로 추천사이트로 이동하기 버튼 (0) | 2011.08.21 |
| 간단한 풀다운메뉴만들기 (0) | 2011.08.19 |
| history.go (0) | 2011.08.16 |
글
랜덤으로 추천사이트로 이동하기 버튼
안녕하세요?
오늘도 소스코드 분석입니다. 오늘 분석할 것은 버튼을 만들어 놓고 클릭하면 랜덤으로 사이트를 이동하는 것입니다. 그럼 소스를 먼저 보시죠.
<script language="JavaScript">
<!--
function go_to(url) {
window.location=url;
}
function rand_link() {
var a;
a = 1+Math.round(Math.random()*3);
// '3' 이라는 숫자를 아래의 사이트 갯수와 맞추어 주세요
// 즉 아래에서 사이트 갯수가 5개이면 5 로 수정하세요
// 랜덤으로 보여줄 사이트들을 설정 합니다
if (a==1) go_to("http://www.yahoo.co.kr");
if (a==2) go_to("http://www.daum.net");
if (a==3) go_to("http://dreamwiz.com");
// 사이트를 추가할때마다 a==숫자 를 증가시킵니다. (a==4, a==5....)
}
//-->
</script>
<input type="button" value="오늘의 추천 사이트" onClick="rand_link()">
함수가 두개 있습니다. 맨처음 함수는 go_to로 인자로 받은 url로 이동하는 것입니다. window.location은 앞에도 나왔었죠? 뒤의 url로 이동하는 거요. 그 다음 rand_link는 a라는 변수를 Math.random()으로 랜덤, 즉 임의의 1-3까지 숫자를 만들어서 a라는 변수에다가 저장하는 것입니다. 그런다음 a가 1,2,3인 경우 go_to함수를 호출하여 뒤의 url을 인자로 넘겨 그 url로 이동하는 겁니다. 그 다음 본문은 input type=button으로 버튼 객체를 만들고 value즉 값을 오늘의 추천 사이트라고 표시하고 onClick즉 클릭했을때 rand_link함수를 호출합니다.
그럼 어떻게 되겠습니까? rand_link함수에서 랜덤으로 1-3까지 숫자를 만들어서 go_to함수를 호출하여 그 url로 이동하게 되는거지요. 이해가시죠? 실행은 직접 해보시길...그럼 다음시간에 또 만나요~
'Java Script' 카테고리의 다른 글
| 버튼-새창띄우기 (0) | 2011.08.25 |
|---|---|
| 사용자가 입력한 내용으로 메시지 띄우기 (0) | 2011.08.23 |
| 간단한 풀다운메뉴만들기 (0) | 2011.08.19 |
| history.go (0) | 2011.08.16 |
| 버튼 눌리면 경고메세지 보여주기 (0) | 2011.08.13 |
글
간단한 풀다운메뉴만들기
안녕하세요?
오늘은 form의 select option을 이용해서 풀다운 메뉴를 만드는 소스입니다. 풀다운메뉴란 예를들어 파일메뉴를 누르면 아래에 새파일,저장,열기등등 이렇게 다른 메뉴가 나오는 겁니다. 나중에 예제를 보시면 이해하시기 쉬울겁니다. 그럼 오늘도 소스를 보고 얘기하도록 합시다.
<script language="JavaScript">
<!--
function goTo(){
var URL = document.form.site.options[document.form.site.selectedIndex].value;
window.location.href = URL;
//-->
}
</script>
<form name = "form">
<select name="site" size=1 onChange ="goTo()">
<option value="">메뉴를 선택하세요
<option value="http://www.yahoo.co.kr">야후! 코리아
<option value="http://www.naver.com">네이버
<option value="http://www.dreamwiz.com">드림위즈
<option value="http://www.lycos.co.kr">라이코스 코리아
<option value="http://www.jasko.co.kr">자바스크립트 소스
</select>
</form>
중요한 부분은
function goTo(){
var URL = document.form.site.options[document.form.site.selectedIndex].value;
window.location.href = URL;
//-->
}
이부분인데요. URL을 선언하고 내용을 document의 form에서 여기서 form은 <form name = "form">의 name뒷부분의 form입니다. 폼의 값이죠. 이 폼은 form이라는 이름을 가지고 있다는 뜻이됩니다. 그다음에 site는 <select name="site" size=1 onChange ="goTo()">의 name="site"입니다. 즉 select박스의 이름입니다. 그 다음 options는 select아래에 option들을 얘기하고요. .value는 그 값 즉 <option value="http://www.lycos.co.kr">라이코스 코리아 이면 value의 값은 http://www.lycos.co.kr이 되겠습니다. 그 뒤에 [document.form.site.selectedIndex] 이부분은 option이 여러개 있는데 그 중에 selectedIndex즉 선택된 값의 인덱스(번호)를 가져오는 겁니다. 예를들어 yahoo.co.kr을 선택하면 그 값의 인덱스가 전달되는 겁니다. 그다음에 window.location.href=URL은 window의 location 객체입니다. 즉 위치를 나타내는 거지요. href는 주소입니다. 즉 윈도우의 주소를 URL의 값으로 하라는 겁니다. URL은 앞에서 선언하고 값을 전달받았죠. onChange ="goTo()" 에서 보면 onChange즉 값이 바뀌면 gioto()함수를 호출하라는 것입니다.
설명이 어려웠는데 쉽게 말해서 폼에 풀다운메뉴를 만들어놓고(여기서는 콤보박스입니다) 그 값이 선택되었을때 goto함수를 호출해서 goto함수는 URL을 메뉴의 값으로 받아서 윈도우 객체를 이용해 그 값의 페이지로 이동하게 되는 겁니다.
쉽게 설명한다고 했는데 어려우셨나요? 한번 직접 실행해보시면 이해하시기 더 빠르실 겁니다.
그럼 실행결과를 보시면서 마치겠습니다.
'Java Script' 카테고리의 다른 글
| 사용자가 입력한 내용으로 메시지 띄우기 (0) | 2011.08.23 |
|---|---|
| 랜덤으로 추천사이트로 이동하기 버튼 (0) | 2011.08.21 |
| history.go (0) | 2011.08.16 |
| 버튼 눌리면 경고메세지 보여주기 (0) | 2011.08.13 |
| 리스트박스의 배경색으로 배경색바꾸기 (0) | 2011.08.10 |
글
history.go
안녕하세요?
오늘도 소스코드를 보면서 설명하도록 하겠습니다.
<form>
<input type="button" value=" 뒤로 " onClick="history.go(-1)">
<input type="button" value="앞으로" onClick="history.go(1)">
</form>
폼속에 input type="button"이 있습니다. 이말은 버튼을 생성하라는 말이지요. value는 그 버튼 위에 값을 얘기합니다. 그러니깐 뒤로라고 하면 버튼이 있고 거기에 뒤로라고 쓰여져 있다는 거지요. 그다음에 onClick은 클릭, 즉 버튼을 눌렀을때 history.go(-1) 즉 history 역사라고 번역되지만 여기서는 웹페이지를 탐색한 순서가 되겠습니다. 그 탐색순서에서 go 가라 어디로? -1 한칸 전으로 그런말입니다. 정리하면 지금 페이지에서 바로 전의 페이지로 가라는 뜻입니다. 만약에 -2라고 하면 두번째 전의 페이지로 가라는 말이겠지요. 그 밑에 go(1)은 이 페이지 앞으로 가라는 겁니다. 예를들어
네이버 -> 야후 -> 다음
이렇게 탐색을 했어요. 여기서 현재페이지가 다음이니깐 -1하면 야후가 되겠지요? 근데 go(1)이라고 하면 갈때가 없잖아요.그래서 아무데도 안갑니다. 근데
네이버 -> 야후 -> 다음 -> 뒤로키를 눌러서 야후
이렇게 탐색했다면 현재 야후에서 go(1)을 하면 다음으로 이동하게 됩니다. 웹브라우저의 뒤로 앞으로 버튼하고 똑같습니다. 이해가 되셨지요? 그럼 결과를 보고 마치도록 하겠습니다.
처음실행했을때
뒤로를 눌리면
'Java Script' 카테고리의 다른 글
| 랜덤으로 추천사이트로 이동하기 버튼 (0) | 2011.08.21 |
|---|---|
| 간단한 풀다운메뉴만들기 (0) | 2011.08.19 |
| 버튼 눌리면 경고메세지 보여주기 (0) | 2011.08.13 |
| 리스트박스의 배경색으로 배경색바꾸기 (0) | 2011.08.10 |
| 마우스 오른쪽 버튼 사용금지 (3) | 2011.08.08 |
글
버튼 눌리면 경고메세지 보여주기
안녕하세요?
오늘도 인터넷의 스크립트 소스를 분석하는 시간입니다. 오늘 예제를 먼저 보시죠.
<input
type="button"
VALUE="경고 메세지를 보려면 이곳을 클릭 하세요"
onClick='alert("오우~! 재밋나여??")'
>
이건데요. 무슨 내용인지 감이 오시는지... 먼저 input type="button" 이라는 부분은 html입니다. 즉 버튼을 만드는 거지요. 근데 값이 뭐냐면 VALUE뒤 부분이 값입니다. 즉 버튼이 만들어졌을때 저 값이 버튼 위에 쓰져있게되는겁니다. 그 다음에 나오는게 자바스크립트인데요. onClick은 말그대로 버튼을 클릭했을때 라는 뜻입니다. 그 뒤에 나오는 거는 우리가 예전에 배웠습니다. alert함수라고 뒤에 나오는 문자를 표시하면서 경고음과 함께 창을 나타나게 하는 함수였죠? 그러니깐 정리하면 onClick즉, 버튼을 클릭했을때 오우 재밋나여를 경고음과 함께 화면에 창으로 나타나게 하라는 말입니다.
그럼 이게 무슨 코드인지 이해가 가시죠? 화면에 버튼하나 만들어 놓고 누르면 경고창을 보여주는 그런 코드입니다. 간단하죠? 간단하면서 유용하고 재밌을거 같습니다. 그럼 실행화면을 보면서 마칠까 합니다.
'Java Script' 카테고리의 다른 글
| 간단한 풀다운메뉴만들기 (0) | 2011.08.19 |
|---|---|
| history.go (0) | 2011.08.16 |
| 리스트박스의 배경색으로 배경색바꾸기 (0) | 2011.08.10 |
| 마우스 오른쪽 버튼 사용금지 (3) | 2011.08.08 |
| 시간대별로 다른 인사 나타내기 (0) | 2011.08.04 |
글
리스트박스의 배경색으로 배경색바꾸기
안녕하세요?
오늘도 소스코드를 가지고 설명하겠습니다. 오늘은 리스트상자안에 색깔을 선택하면 그 색깔로 배경이 바뀌는 소스입니다.
<form>
<select Size=5 name=clr onChange="document.bgColor=this.options[this.selectedIndex].value">
<option value="blue">blue
<option value="aquamarine">aquamarine
<option value="chocolate">chocolate
<option value="darkred">dark red
<option value="gold">gold
<option value="red">red
<option value="yellow">yellow
<option value="hotpink">hotpink
<option value="lime">lime
<option value="darkkhaki">dark khaki
<option value="cadetblue ">cadet blue
<option value="darkgoldenrod">dark goldenrod
<option value="darkslateblue">dark slate
<option value="blue">blue
<option value="deeppink">deep pink
<option value="darksalmon">dark salmon
<option value="salmon">salmon
<option value="tan">tan
<option value="wheat">wheat
<option value="tomato">tomato
<option value="springgreen">springgreen
<option value="turquoise">turquoise
<option value="white" selected>White
</select>
</form><!---->
<select> <option> 은 리스트 박스를 만드는 겁니다. value는 값을 얘기하구요. 이 value는 위에 onChange에 사용된 value값으로 사용됩니다. 중요한 것은 onChange인데요. 말그대로 선택사항이 바뀌면 뒤의 문장을 실행시켜라 하는겁니다. 뒤의 문장에 뭐냐면 document.bgColor=this.options[this.selectedIndex].value 이거지요. 도큐먼트의 bgColor즉 배경색을 option에 있는 걸로 selectedIndex 즉 선택된 값의 value즉 값으로 bgColor를 바꾸어라 하는 겁니다. 이해가 가실런지...쉽게 말해서 아래에 tomato가 선택이 되면 option value="tomato" 즉 값이 tomato이기 때문에 bgColor="tomato"가 되는 거지요. 실행은 직접 해보시기 바랍니다. 재미있는 소스인거 같습니다.
그럼 다음시간에 또 만나요~
'Java Script' 카테고리의 다른 글
| history.go (0) | 2011.08.16 |
|---|---|
| 버튼 눌리면 경고메세지 보여주기 (0) | 2011.08.13 |
| 마우스 오른쪽 버튼 사용금지 (3) | 2011.08.08 |
| 시간대별로 다른 인사 나타내기 (0) | 2011.08.04 |
| Function 객체 (0) | 2011.08.01 |
글
마우스 오른쪽 버튼 사용금지
계속해서 소스코드 분석을 해보겠습니다. 오늘은 마우스 오른쪽 버튼 사용금지 코드입니다. 인터넷을 돌아다니다보면 글을 나의 사이트로 옮겨와야할때가 있는데 어떤 곳은 가보면 글이 선택도 안되고 선택되어도 오른쪽 버튼으로 복사해 갈수 없게 만들어 놓은 곳이 많습니다. 불법 스크랩을 방지하기 위해선데요. 좋은거 같기도 하지만 그래도 같이 자료를 공유하면 더 어떨까하는 생각도 듭니다. 그럼 소스코드를 볼까요?
<html>
<head><title>마우스 오른쪽 금지</title>
<script language="javascript">
function noRightClick() {
if (event.button==2) { // 오른쪽버튼 클릭하면
alert('오른쪽 버튼 사용금지')
}
}
document.onmousedown=noRightClick;
</script>
</head>
</html>
간단하지요? 함수 noRightClick을 선언하고 만약에 event.button==2 이 말은 마우스 버튼이 오른쪽 버튼이 눌러지면 이라는 뜻이지요. 그러면 alert 경고음과 함께 오른쪽 버튼 사용금지라는 문구와 함께 대화상자가 나타납니다. 그 밑에 document.onmousedown은 마우스 버튼이 눌러졌을때 noRightClick함수를 호출해라 하는 얘깁니다.
그럼 어떻게 실행되는지 한번 볼까요?
이런식으로 나오네요. 자바스크립트는 모든 문장을 다 완벽하게 이해하려고 하기보다는 다른 사람이 만들어 놓은 것을 자신의 것으로 소화시킬 수 있느냐 하는 게 더 중요하다고 생각됩니다. 다른 사람이 만들어 놓은 괜찮은 소스를 보고 나의 코드에 적용시킬수만 있다면 왠만한건 다 나와있으니깐 받아와서 사용하시면 될것입니다. 그럼 오늘은 여기까지 다음시간에 또 만나요~
'Java Script' 카테고리의 다른 글
| 버튼 눌리면 경고메세지 보여주기 (0) | 2011.08.13 |
|---|---|
| 리스트박스의 배경색으로 배경색바꾸기 (0) | 2011.08.10 |
| 시간대별로 다른 인사 나타내기 (0) | 2011.08.04 |
| Function 객체 (0) | 2011.08.01 |
| Math 객체 (0) | 2011.07.26 |
글
시간대별로 다른 인사 나타내기
안녕하세요?
오늘부터는 인터넷에 있는 자바스크립트 소스를 가져와서 분석하는 시간을 가지도록 하겠습니다. 첫번째로 http://www.javascript.co.kr에서 가져온 시간대별로 다르게 인삿말을 나타내는 소스입니다. 전체 코드는
<html>
<head><title>시간대별인사다르게</title>
<script>
var Digital=new Date()
var hours=Digital.getHours()
// 아래에서 시간대별 메세지를 입력 하세요
if (hours>=5&&hours<=11) // 오전에 보여줄 메세지
document.write('<b>Good morning 좋은 아침 입니다</b>')
else if (hours==12) // 12시에 보여줄 메세지를 입력 하세요
document.write('<b>땡! 12ㅣ 입니다. 어떤 뉴스가 나올까요</b>')
else if (hours>=13&&hours<=17) // 12시에서 5시까지 보여줄 메세지
document.write('<b>나른한 오후군요. 재밋게 보내세요</b>')
else if (hours>=18&&hours<=20) // 저녁6시부터 8시 사이에 보여줄 메세지
document.write('<b>음, 벌써 저녁시간이네요. 식사는 하셨나요?</b>')
else if (hours>=21&&hours<=23) //밤 9시부터 12시 사이에 보여줄 메세지
document.write('<b>슬슬 잠자리에 들어야 할 시간이군요</b>')
else // 기타 시간대에 보여줄 메세지 (23시부터 새벽4시사이)
document.write('<b>이런! 아직 안주무셨나요? 아님, 벌써 일어나신건가..^^</b>')
</script>
</head>
</html>
입니다. 우리가 안 배운 것은 하나도 없습니다. 이제까지 잘 따라오셨다면 전부 이해하시리라 믿습니다. 먼저 Date객체를 선언하지요. var Digital=new Date() Digital이라는 날짜객체를 선언하고 그 밑에 hours라는 변수에 Digital.getHours() 즉 시간구하는 객체의 메소드를 이용해서 시간을 구합니다. 여기까지 이해하셨어요? 이 부분만 이해하시면 아무 문제 없을겁니다.
그 다음으로 if else문입니다. &&는 and라는 뜻입니다. 즉 hours가 5보다 크거나 같고 11보다 작거나 같으면 아래 문장을 출력하라는 것입니다. 아래도 다 마찬가지입니다. == 는 같다라는 뜻입니다. 그래서 hours==12 는 hours가 12와 같으면 즉 12이면 아래 문장을 출력하라는 것입니다. 그리고 <b>태그는 bold의 약자로 글자를 굵게 표시하라는 것입니다.
이해안되시는 부분이 있으신가요? 그러면 다시 앞의 부분들을 공부하시면 이해가 되실겁니다.
그럼 다음시간에 또 다른 소스를 가지고 뵙겠습니다.
'Java Script' 카테고리의 다른 글
| 리스트박스의 배경색으로 배경색바꾸기 (0) | 2011.08.10 |
|---|---|
| 마우스 오른쪽 버튼 사용금지 (3) | 2011.08.08 |
| Function 객체 (0) | 2011.08.01 |
| Math 객체 (0) | 2011.07.26 |
| Date객체 (0) | 2011.07.25 |
