8. 변수선언초기화 참조

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 22:21 |

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>
    <title>변수선언초기화 참조</title>
</head>

<body>
<script type="text/javascript">
    //[0]변수(Variable) : 프로그램에서 사용하는 데이터를 임시 보관하는 "메모리상의 임시 데이터 저장공간(그릇)"

    //[1] 변수 선언(정의)
    var num; // num이라는 이름으로 변수 만들자
    //[2] 변수 초기화(할당)
    num = 1234; //1234를 대입
    //[3] 변수 참조
    document.write("num에 들어있는 값 : " + num + "<br />");

    //[!] 변수 이름 짓는 법: 파스칼표기법, 헝가리언표기법, 낙타(Camel)표기법
    var my_num = 1234; // _(언더바)로 구분, C/C++에서 많이 쓴다.
    var strnum = "1234"; // 접두사(str)로 구분, VB에서 많이 쓴다.
    var myNum = '1234'; // 두번째 단어 이후의 첫자를 대문자로, C#과 Java에서 많이 쓴다.
    var intMyAge = 21; // 3가지 방식 혼용(현대)
</script>
</body>
</html>


<!-- .NET에서는 낙타표기법을 기준으로 본다. 낙타표기법과 혼용방식을 써라! -->
<!-- 블로그에 세가지 표기법에 대한 자료 올려놓을 것! -->


< 실행결과 >




8.변수선언초기화참조.htm


'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

10. 관계연산자  (0) 2009.07.30
9. 산술연산자  (0) 2009.07.30
7. 기본출력문  (0) 2009.07.30
6. 객체 속성 메서드(함수) 이벤트 사용  (0) 2009.07.30
5. 자바스크립트 작성 시 주의할 점  (0) 2009.07.30
Posted by holland14
:

7. 기본출력문

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 21:34 |

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>
     <title>기본출력문</title>
</head>

<body>

<script type="text/javascript">
    //[1]
    document.write("문서 영역에 결과 값 출력<br />");
    window.document.write(
    "<span style='color:red;'>window</span> 객체는 생략 가능</br />"); // 큰따옴표("") 안에는 작은따옴표('')로 묶어야 함.
    //[2]
    window.alert(" \"메시지박스\" 결과 값 출력"); // 큰따옴표("")를 메시지박스 안에 표시하고자 할때는 "앞에 \표기하면 됨.
    alert("역시 window 객체(개체)는 생략 가능");
</script>

</body>
</html>



< 실행결과 >

7.기본출력문.htm





--> 첫번째 메시지박스 '확인'버튼 누른 후



'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

9. 산술연산자  (0) 2009.07.30
8. 변수선언초기화 참조  (0) 2009.07.30
6. 객체 속성 메서드(함수) 이벤트 사용  (0) 2009.07.30
5. 자바스크립트 작성 시 주의할 점  (0) 2009.07.30
4. 태그 내에 자바스크립트 정의  (0) 2009.07.30
Posted by holland14
:

6. 객체 속성 메서드(함수) 이벤트 사용

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 20:29 |

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>객체(개체) 속성 메서드(함수) 이벤트</title>
    <script language="javascript" type="text/javascript">
        document.write("1. 객체.메서드()"); // document : 객체 / write() : 메서드(함수)
        document.title = "2. 객체.속성"; // 익스플로러창 맨위에 위치한 '파란색칸(타이틀영역)의 이름(제목)'
    </script>
</head>
<body>
<!--
click : click 이벤트
onclick : click 이벤트 발생시 실행할 onclick 이벤트 핸들러(처리기)
-->
<input type="button" value="클릭" onclick="window.alert('안녕');" />

</body>
</html>


<!--
- <title>태그로 제목이 있지만 아랫줄에 있는 자바스크립트의 title속성이 적용된 것을 실행결과에서 볼 수 있다.
-->


< 실행결과 >



6.객체속성메서드이벤트사용.htm


'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

8. 변수선언초기화 참조  (0) 2009.07.30
7. 기본출력문  (0) 2009.07.30
5. 자바스크립트 작성 시 주의할 점  (0) 2009.07.30
4. 태그 내에 자바스크립트 정의  (0) 2009.07.30
3. 자바스크립트 코드 분리  (0) 2009.07.30
Posted by holland14
:

5. 자바스크립트 작성 시 주의할 점

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 20:25 |

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>

    <title>자바스크립트 작성 시 주의할 점</title>

</head>

<body>
<script language="javascript" type="text/javascript">    // 요즘에는 버전표기 안해줘도 됨.
    document.write("마지막 버전"); 
</script>
<br />

<script language="javascript1.3" type="text/javascript">
    document.write("1.3버전");
</script>
<br />

<script language="javascript" type="text/javascript">   // language="javascript"는 생략가능함.
<!--
    document.write("자바스크립트를 알지 못하는 웹브라우저를 위해서 주석 표기");
--> 
</script>

<script language="javascript" type="text/javascript">
<!--
//여기에 경고 대화상자를 하나 출력
/*
메시지박스를 출력하고자 할 때에는
window.alert() 명령어를 사용한다.
*/
window.alert("경고 대화상자 출력");
//
-->
</script>

</body>

</html>


<!--

- 3번째 자바스크립트 코드단락에서 자바스크립트 문장 위아래로 주석을 표기하였는데, 자바스크립트를 인식못하는 브라우저는 자바스크립트 문장까지 주석으로 처리/무시하고 넘어감. 현재는 많이 안쓰인다.
 
  -->

< 실행결과 >

5.자바스크립트작성시주의할점.htm


'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

7. 기본출력문  (0) 2009.07.30
6. 객체 속성 메서드(함수) 이벤트 사용  (0) 2009.07.30
4. 태그 내에 자바스크립트 정의  (0) 2009.07.30
3. 자바스크립트 코드 분리  (0) 2009.07.30
2. HTML에 자바스크립트 삽입하기  (0) 2009.07.30
Posted by holland14
:

4. 태그 내에 자바스크립트 정의

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 17:26 |

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
 <title>태그 내에 직접 자바스크립트 정의</title>
</head>
<body>

<input
    type="button" value="버튼" 

    style="background-color:Yellow;border:solid 1px red;" 

    onclick="window.alert('클릭');"
    onmouseover="this.style.backgroundColor='green';"
/>

</body>
</html>


<!-- "on"으로 시작하는 부분이 JavaScript이다. -->

< 실행결과 >

4.태그내에자바스크립트정의.htm




--> 마우스 오버시


--> 클릭시



'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

6. 객체 속성 메서드(함수) 이벤트 사용  (0) 2009.07.30
5. 자바스크립트 작성 시 주의할 점  (0) 2009.07.30
3. 자바스크립트 코드 분리  (0) 2009.07.30
2. HTML에 자바스크립트 삽입하기  (0) 2009.07.30
1. JavaScript 시작  (0) 2009.07.30
Posted by holland14
:

3. 자바스크립트 코드 분리

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 17:24 |


================================== 자바스크립트코드분리.htm ===================================

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>자바스크립트 코드를 외부에 두기</title>
</head>
<body>
<script
     language="javascript"
     type="text/javascript"
     src="js/Alert.js"> /* 외부에 있는 JavaScript파일과 연동하려면 src="~"로 경로설정해줘야 한다. */
</script>
</body>
</html>


========================================== Alert.js ============================================

document.write("메시지박스 출력 후 문서 영역에 출력");
window.alert("외부에 자바스크립트 코드 사용");


< 실행결과 >




3.자바스크립트코드분리.htm

Alert.js

'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

6. 객체 속성 메서드(함수) 이벤트 사용  (0) 2009.07.30
5. 자바스크립트 작성 시 주의할 점  (0) 2009.07.30
4. 태그 내에 자바스크립트 정의  (0) 2009.07.30
2. HTML에 자바스크립트 삽입하기  (0) 2009.07.30
1. JavaScript 시작  (0) 2009.07.30
Posted by holland14
:

2. HTML에 자바스크립트 삽입하기

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 16:51 |


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title> HTML에 자바스크립트 삽입하기 </title>
 <style type="text/css">
 body
 {
  color:blue;
 }
 </style>

 <script language="javascript" type="text/javascript">
     //도큐먼트 객체(개체)의 write 메서드(Method:함수)로 화면에 출력
     document.write("안녕하세요.<br />");
     document.write("반갑습니다.<br />");
     // 윈도우 객체의 alert() 함수 호출로 경고대화상자(메시지박스) 출력
     window.alert("또 만나요. \n낼 봐요.");
 </script>
</head>
<body>

 

</body>
</html>

<!--
자바스크립트 코드는 <head>태그 사이에 들어갈 수도 있고, <body>태그 안에 들어갈 수도 있고 <html>태그 밖에 넣을 수도 있다.
일반적으로는 <head>태그 안에 삽입한다.
-->

< 실행결과 >




2.자바스크립트삽입.htm

'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

6. 객체 속성 메서드(함수) 이벤트 사용  (0) 2009.07.30
5. 자바스크립트 작성 시 주의할 점  (0) 2009.07.30
4. 태그 내에 자바스크립트 정의  (0) 2009.07.30
3. 자바스크립트 코드 분리  (0) 2009.07.30
1. JavaScript 시작  (0) 2009.07.30
Posted by holland14
:

1. JavaScript 시작

.NET프로그래밍/JavaScript 1.2 2009. 7. 30. 16:09 |

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>자바스크립트 시작</title>

</head>
<body>

<h3>안녕하세요.</h3>  <!-- HTML레벨(기본기능) -->

<h3 style="color:red;">반갑습니다.</h3> <!-- CSS레벨(HTML에 "색상", "크기", "모양" 관련 기능추가) -->

<h3 style="color:blue;background-color:yellow;"
 onclick="alert('클릭하셨군요.');"
>또 만나요.</h3> <!-- JavaScript레벨(HTML, CSS기능에 더하여 "동적인 기능"추가) -->

</body>
</html>

<!--
- HTML에 동적인 기능을 주고자 할 때 JavaScript를 사용한다.
- "onclick"은 JavaScript로 '동적기능'을 줄 때 주로 쓰이는 이벤트핸들러이다.
-->

< 실행결과 >




1.자바스크립트시작.htm

'.NET프로그래밍 > JavaScript 1.2' 카테고리의 다른 글

6. 객체 속성 메서드(함수) 이벤트 사용  (0) 2009.07.30
5. 자바스크립트 작성 시 주의할 점  (0) 2009.07.30
4. 태그 내에 자바스크립트 정의  (0) 2009.07.30
3. 자바스크립트 코드 분리  (0) 2009.07.30
2. HTML에 자바스크립트 삽입하기  (0) 2009.07.30
Posted by holland14
:

티스토리툴바