JavaScript ep.1

JavaScript에 대해 공부한 내용을 정리해보려고 한다...
하루에 0.1mm 씩이라도 앞으로 가자는 마음으로 해보자!

간단하게 JavaScript는 HTML을 마음대로 조작을 할 수 있는 언어라고 한다.

개인적으로 이말만 들었을 때 그럼 그냥 HTML로 만들면되지 왜 JavaScript가 필요한지 이해가 되지 않았다.

우선, JavaScript를 쓰는 방법은 크게 2가지가 있다.

1. HTML 문서 body안에 직접 자바스크립트를 작성하는 방법

<script>
	JavaScript 코드 작성
</script> 

2. 따로 .js 확장자의 파일을 만들어 링크하는 방법.

<script src="파일 경로"></script>

적용하는 방법은 CSS랑 크게 다르지 않아 어색하지는 않았다.

JavaScript를 가지고 어떻게 HTML을 조작(?)하는지 알아보았다.

<h1 id="html"> 나는 HTML </h1>

위 처럼 html 문서가 있다고 하였을 때 안에 내용을 바꿔 보았다.

<script>
  document.getElementById('html').innerHTML = '나는 JavaScript';
</script> 

확인을 해보니 "나는 HTML" 이라고 있어야하는 자리에 "나는 JavaScript"라는 친구가 있었다.

JavaScript에 쓴건 무엇을 뜻하는 걸까? 하나씩 뜯어봤다.

"document.getElementById('html').innerHTML = '나는 JavaScript';"

document 는 "문서" "."은 ~의 getElementById은 get 가져온다.
Element 는 요소 ById Id의 innerHTML 안의 HTML "=" 대입 '나는 JavaScript'라고 할 수 있다.

정리하면 문서의 'html'이라는 id의 안에있는 HTML을 '나는 JavaScript'로 바꿔줘 라는 뜻으로 이해를 하면 될 것 같다.

<script>
  document.getElementById('OO').OOOO = 'OOOO';
</script> 

그럼 위 코드에서 빈칸만 채우면 원하는 id의 html을 찾아서 원하는 값을 적용시킬 수 있겠구나! 하는 생각이 들었다.

끝!