: HTML과 CSS 언어는 주로 정적인 역할을 함
→ HTML에 이벤트[행동]을 실행하는 역할
→ HTML, CSS, JS 구조 ; html에 얹혀간다. (= html에만 하이퍼텍스트 통신 규약이 있기 때문)
<html>
<head>
스타일(CSS) → 혼자 실행X
</head>
<body>
마크업(HTML) → 혼자 실행가능은 함.
스크립트(JS) → 혼자 실행 X
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js 실행</title>
</head>
<body>
<!--
HTML에서 JS을 적용하는 방법.
1. body 마크업 <script> 사용
2. 외부파일 가져오기 사용
크롬[브라우저] -> console 확인
1. 실행된 HTML에서 F12 [개발자 도구]
2. console[콘솔]탭에서 확인.
-->
<!-- 1. -->
<script>
console.log("js 시작합니다1.");
</script>
<!-- 2. 외부 파일[권장] : js을 html안에 넣으면 코드가 너무 커짐. -->
<script src="0.js파일.js">
</script>
<!-- 1. 주석 / 출력 -->
<script src = "1.js출력.js" type = "text/javascript">
</script>
</body>
</html>
console.log("js 실행합니다2.");
/*
크롬[브라우저] : 개발자 도구 F12
console : 입력과 출력이 가능한 구역
*/
// JS :
// 1. 주석 : 실제 실행되지않는 구역부분 [범위 + ctrl + shift + /]
// // : 한줄 주석
// /* */: 여러줄 주석
/*
2. 출력
1. console.log(); :콘솔에 출력하는 함수 [테스트 용도]
- js코드 ----> 브라우저의 개발자 도구 console 출력
2. alert() : 알람 메시지를 출력하는 함수
3. document.write(); : HTML body 출력
3. 제어문자[이스케이프 문자]
1. 엔터 위에 원화기호[백슬래시] : \\
1. \\n : 줄바꿈
2. \\t : 들여쓰기 [Tab만큼 띄우기.]
3. \\\\ : 백슬래시 두개 -> 백슬래시 하나 나옴. [백슬래시가 키워드 이기 때문.]
4. \\' : 백슬래시 작은 따옴표 -> 작은따옴표 하나 나옴 [키워드이기 때문]
5. \\" : 백슬래시 큰 따옴표 -> 큰 따옴표 하나 나옴 [키워드이기 때문]
*
키워드 : 미리 만들어진 단어들
데이터 :
1. 문자 : 1. ' ' 2. " "
2. 숫자 : 아무런 제약없이 그냥 씀.
3. 논리 : true or false
*/
//1. 출력 [세미콜론 빼도되고 안빼도 됨.] -> console.log(출력할 데이터/값)
console.log("Hello World!"); //=> 작은따옴표('') 안에 있는 데이터는 문자 처리
console.log('Hello World!'); //=> 큰따옴표("") 안에 있는 데이터는 문자 처리
console.log(300); //숫자로 된 키워드가 없기 때문에 숫자만 써도됨.
console.log("300"); //숫자를 문자 처리 한것. -> 문자가 됨. (숫자가 아님)
console.log('300'); //숫자를 문자 처리 한것. -> 문자가 됨. (숫자가 아님 )
console.log(true); //논리는 문자처리 안함.
console.log(false); //논리는 문자처리 안함.
//2. alert이 두개면 순서대로 출력. -> alert(출력할 데이터/값)
alert("(alert1)Hello World!");
alert("(alert2)Hello World!!")
alert(200+300); //alert으로 숫자 연산 가능.
alert(true); //고대로 출력 (논리)
//작은 따옴표를 빼면 오류가 발생
/*console.log(Hello World!); //=> 이렇게 문자 처리 실행시 오류 발생 */
//3. 제어문자.
console.log("안녕하세요\\njs처음입니다.1")
console.log("안녕하세요\\ttab입니다.2")
console.log("안녕하세요\\js처음입니다.3") //-> 이러면 안나옴
console.log("안녕하세요.\\\\js처음입니다.4");
console.log("안녕하세요\\'js처음입니다.\\'5") //작은 따옴표 출력
console.log("안녕하세요\\"js처음입니다.\\"5") //큰 따옴표 출력
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js 실행</title>
</head>
<body>
<!-- 출력 문제 -->
<script src = "1.js출력문제.js">
</script>
</body>
</html>
console.log("\\\\ / \\\\\\n ) ( \\') \\n( / )\\n \\\\(_ _)|")
console.log("|\\\\_/|\\n|q p| /}\\n( 0 )\\"\\"\\"\\\\\\n|\\"^\\"\\` |\\n||_/=\\\\_ _|")
