자바스크립트 1장 } 정의, 역할, 사용방법

자바스크립트의 정의 

1. html, 상호작용성과 동적 시각효과를 나타내기 위해 필요한 객체기반의 스크립트 언어이며 웹사이트에서 많이 사용된다

2. 다른 응용프로그램 내장객체에도 접근하고 나타내기 위해 사용된다

3. 클라이언트와 서버로 구분되며, 클라이언트측면에서 볼때 페이지 문장안에서 작성된 웹 문서의 실행이 가능하고 

   서버측 관점에서는 웹서버에 제출된 웹문서를 처리하고 변환한다



자바스크립트와 웹개발의 역활

1. 자바스크립트를 html 페이지에 삽입하고 문서의 객체모델DOM을 이용하여 구조화하고 페이지에 어떻게 적용시켜야 하는지 생각해야 한다

2. CSS이용하여 페이지의 환경을 설계한다. 

3. 장점은 직접 결과를 확인할수 있도록 한다. 웹페이지가 페이지와 서로 작용하는 행위에 즉시 응답하도록 하고 링크를 클릭하거나 폼을 채우거나 화면에서 마우스를 움직인다

4. 웹브라우저와 웹서버 사이의 통신을 통해 php같이 서버측 프로그래밍 언어와 관련된 지연현상을 발생하지 않는다



자바스크립트와 자바의 차이점

   자바  자바스크립트  
 해석위치  서버  클라이언트   서버부하를 줄이는 장점
 언어형  컴파일러  인터프리터  윗줄에서 오류감지, 그 다음은 실행하지 않는다.
 존재  *.class파일로 존재

 html 문서내에 기술

  *.js 확장화일 가능

 객체지향

 객체지향 언어

 객체기반언어

  이미 만들어진 메소드를 쓰는 라이브러리 언어. 
 node.js 서버연동 가능 발전가능높다



자바스크립트 사용방법


1. 내장형 (내부형이라고도 함. html과 같이 있다고 해서)

   CDATA는  문법적 오류를 피하기 위해  문법적 오류를 피하기 위해  반드시 작성

   보통은 <head> 넣는데, <body> 안에 쓸때도 있다. 요소 읽기 전에 문서를 읽고 제어한다


  1. <script type ="text/javascript">
  2.    //<!CDATA[
  3.        실행코드;
  4.    //]]>
  5.  </script>

2. 행입력형 (스크립트를 직접쓰는것)

   <태그 이벤트핸들러="자바스크립트 소스">
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.  <head>
  4. <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
  5. <title> new document </title>
  6. <script type="text/javascript">
  7. //![CDATA[
  9. //]]>
  10. </script>
  11. </head>
  12. <body>
  13. <button onclick="alert('이벤트')">버튼1</button> 행입력형
  14. </body>
  15. </html>

3. 함수형

  1. <script type ="text/javascript">
  2.    //<!CDATA[
  3.       function  함수명(){
  4.                    실행코드
  5.       };
  6.    //]]>
  7.  </script>


  1. <script type ="text/javascript">
  2.    //<!CDATA[
  3.       function  mapGuide(){
  4.                    document.write("아자아자아자!<br/>")
  5.        };
  6.       mapGuide();
  7.       mapGuide();
  8.       mapGuide();
  9.    //]]>
  10.  </script>



4. 링크형 

<script type="text/javascript" src="파일경로"></script>
- 링크형은 유지관리 쉽다. 라이브러리를 사용할 수 있다

  1. document.write('안녕하세요!<br />'); 
  2. document.write("<h1>반가워요~</h1>");
1. link.js라는 이름으로 저장하자
  1. <script type="text/javascript" src="js/link.js"></script>
  2. </head>
  3. <body>
  4. <button onclick="alert('이벤트')">버튼1</button> 행입력형
  5. </body>

2. 이러한 화면으로 표시되는 것을 볼 수 있다.


저작자표시

'공부 > 자바스크립트' 카테고리의 다른 글

자바스크립트 3장 } 자바스크립트 작성시 주의사항  (0) 2013.01.08
자바스크립트 2장 } 객체, 속성, 메소드  (0) 2013.01.08
Posted by uuulike :

티스토리툴바