320x100
1. 자바스크립트
a. 자바스크립트는 웹 페이지에서 일어나는 다양한 동작을 제어할 수 있는 언어
버튼을 클릭했을 때 무슨 일이 일어나도록 하거나, 페이지 내용을 바꾸는 등의 작업 가능
2. HTML에 자바스크립트 넣기
HTML 문서에 자바스크립트를 추가하려면 <script> 태그를 사용
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<p>script 전</p>
<script>
alert('hello world!')
</script>
<p>scripr 후</p>
</body>
</html>
3-1. 실행결과 (HTML 파일에서 실행)
3-2. 실행결과 (외부 파일에서 실행)
// html에 옮길 js 파일을 먼저 만듦
alert('hello world!')<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script src="/js/helloworld.js"></script>
</body>
</html>
동일한 실행 결과가 나타남
4. 연습문제 (alert 복습 : java script 뜨게 하기)
a. HTML로 실행
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
alert('java script!')
</script>
</body>
</html>
b. 외부파일로 실행
alert('java script!')
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="/js/javascript.js">
</script>
</body>
</html>
반응형
'코딩 > JS' 카테고리의 다른 글
| JS 자바스크립트 Alert , FUNTION 웹페이지 적용 (0) | 2024.08.28 |
|---|---|
| JS 자바스크립트 형변환 설명 (0) | 2024.08.27 |
| JS 자바스트립트 자료형 기초 (0) | 2024.08.27 |
| JS 자바스크립트 alert, prompt, confirm 활용 (0) | 2024.08.27 |
| JS 자바스크립트 변수와 상수 (2) | 2024.08.26 |
