▣ HTML은 단순히 보여주거나 이동하는 명령들이고, 이것들을 프로그래밍하기 위해서는 Javascript를 html 문서에 삽입해서 사용해야 하는데요. 자바스크립트를 HTML 문서에 삽입하는 형식에 대해서 알아보겠습니다. 삽입하는 형식을 알아보기 전에 간단하게 자바스크립트의 특성을 살펴보고 넘어갈게요. 이 특성을 알고 있으면 자바스크립트 이용하는 데 많은 도움이 될 겁니다. 일단 자바스크립트의 가장 큰 특징은 자바에 비교하면 작성이 쉽고, 호환성이 좋아서 시스템에 구애받지 않고 사용할 수 있구요. 따로 가공하지 않고도 HTML 문서 안에 바로 삽입할 수 있으며 데이터형을 설정하지 않아도 됩니다. 단점이라면 소스가 노출되기 때문에 보안에는 취약한 면이 있습니다. 앞으로 HTML과 자바스크립트를 계속 공부하면서 정리할 건데요. 지금은 무슨 말인지 이해가 잘 안 돼도.... 다음 포스팅들을 계속 참고 해서 보시면 도움이 좀 될 겁니다. ^^
본론으로 들어가서 'HTML' 문서에 'Javascript'를 삽입해보겠습니다.
■ html 태그 안에 <script> 태그를 이용해서 삽입하면 되는데요. language="javascript" 를 입력해주시면 되구요. [document.write]는 브라우저에 문자열을 출력할 수 있게 해주는 자바스크립트 메소드 입니다. 메소드를 입력하고 출력될 내용을 입력해주면 되구요. <p>태그와 <br>태그를 이용해서 한 칸 띄우기도 하고 다음 줄로 이동해서 출력되도록 했습니다. <body> 태그 안쪽에도 스크립트를 삽입하고 외부에도 삽입했는데요. 이 문서를 html 형식으로 저장하고 브라우저에서 열어보겠습니다.
■ 이렇게 브라우저에서 출력됩니다. HTML 소스코드와 출력내용을 잘 비교해보시면 어렵지 않은 내용이에요. ^^
다음은 HTML에서 자바스크립트를 불러와서 출력하도록 하는 과정을 살펴보고 마무리할게요. 먼저 자바스크립트(js) 파일을 하나 만들겠습니다.
■ 메모장에 다음과 같이 소스코드를 입력하고 C:드라이브에 test.js파일로 저장했습니다.
HTML 문서에서 위에서 저장한 js파일을 불러와서 브라우저에서 열어보겠습니다.
■ 역시 <script> 태그로 묶어 주고 language는 "javascript"를 넣어주고, [src]에는 js파일의 경로를 포함한 이름을 넣어주면 됩니다. 이 문서를 HTML 문서로 저장하고 브라우저에서 열어보겠습니다.
■ 이렇게 따로 만들어 놓은 js파일을 불러와서 브라우저에서 출력할 수 있습니다. 수고하셨어요.^^
