블로그 이름을 입력해주세요

[JS] javascript의 시작! 본문

javaScript

[JS] javascript의 시작!

Dev_jihoon8730 2022. 2. 7. 22:56

그동안 CSS로 어렵사리 만들어본 작동기능들

 

이제는 js로 쉽게 해보자

 

HTML

<body>
  <h3>hello JS!</h3>
  <script>
    여기에 자바스크립트 넣어주삼
  </script>

</body>
</html>

이것을 자바스크립트 문법을 통해 바꿔보겠다 

 

먼저 자바스크립의 기능을 구현하려면 h3에 id를 줘야한다

 

<h3 id="아무거나">hello JS!</h3>

한글도 가능!

그리고

 

<script> 안에 규칙을 지켜 넣어주면 끝

영어보다 한글로 먼저 써드릴게요

 

문서 안에 아이디를 찾아서 이 기능으로 바꿔줘

이걸 다른말로

<script>
    document.getElementById('아무거나이름').innerHTML = '헬로제이에스!';
  </script>

document  문서

getElementById('아무거나이름')   찾은 아이디

innerHTML  이기능으로

 

'헬로제이에스'  바꿔줘

 

<body>
  <h3 id="아무거나이름">hello JS!</h3>
  <script>
    document.getElementById('아무거나이름').innerHTML = '헬로제이에스!';
  </script>
</body>

h3에 id가 '아무거나이름' 이니까 h3를 바꿔줘

 

여기서 innerHTML은 안에있는HTML을 바꿔

 

뭐로 '헬로제이에스!'로

결과

참고 - 코딩애플

MDN - javascript

MDN에서는 개발자가 되기위한 자바스크립트 코스같은것도 마련해 놓은거 같은데

유료강의나 다른걸 사기전 맛보기로 봐도 좋을거 같아요

 

이어서

>>>

'javaScript' 카테고리의 다른 글

[JS/javascript] addEventListener 애드이벤트리스너 !  (0) 2022.02.14
[JS / javascript] function함수 parameter(파라미터) 인자  (0) 2022.02.09
[JS / javascript] jquery(제이쿼리) !!  (0) 2022.02.09
[javascript] Rest parameters (added in ES6)  (0) 2022.01.23
[javascript] 파라미터(parameter)  (0) 2022.01.23
'javaScript' Related Articles more