JavaScript 

오 대박 자바스크립트를 바로 들어간다!

내가 드디어 웹브라우저를 직접 다루는 언어를 배우게 되었다는 것이여 ! 가족들한테  자바 코딩한거 보여줘도 영 반응이 시원찮았는데 이제 브라우저 창 보여주면서 설명하면 좀 알겠지 후후후 자랑할게 생겼다

나중에 프론트엔드쪽으로 갈 사람들은 이거 진짜 잘 해야 한다고 하셔서 오늘 완전 초 집중해서...

졸았다

어휴 바보도 아니고 ... 나이가 들어서인지 몸뚱이가 내 말을 정말 안듣는다 ..

내일은 커피를 한바가지 들이 부어서라도 정신 똑띠 차리고 수업들어야지

다행히 오늘은 첫 시간이라 그런지 천천히 진도를 나가서 복습 잘하고 제대로 따라가야 겠다.

 

맴이 급하니 자바스크립트의 정의 따윈 없이 바로 실전에 들어간다

어차피 이론 정리해도 지금 못알아 들어.. 실전으로 단련시킨 후 면접대비로 정리해도 충분할 것 같다 

그래도 간단히는 알아야 하니까

 CSSL (Client-Side Script Language) 는 "웹브라우저" 에 의해 순자적으로 해석되는 언어 임(웹클라이언트 프로그램) 
 CSSL의 대표적인 예로는 HTML5/CSS3/JAVASCRIPT/jQuery등이 있다

주석처리 등등 자바에서 쓰는 것 들이 많이 비슷하다

 

코드가 가장 잘 구현되는 브라우저가 말로만 슬쩍 들어본 파이어폭스 라고 한다... 당장 깔음

우선 자바스크립트도  코드가 순차적으로 해석되는 언어라는 것을 확인하기 위해 두 가지 예시를 보여 줌

우선 <script> 요기 안에서 alert() 를 쓰면 팝업창을 만들 수 있는데 이게 어디서 쓰는 지 순서가 되게 중요 함!!

참고로 팝업창을 클릭하지(처리하지) 않으면 그 다음 코드를 실행 할 수 없다!

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScriptFirst.html</title>
    <script> // 이 코드를 쓰면 팝업창을 만들 수 있다!
       alert("자바스크립트 함수 입니다.");  오 여기다가 두면 글자가 아예 안보임  
      // 모달(팝업 창) 클릭을 안하면(처리를 안하면) 뒤에 코드 진행이 안되기 때문
      //  <h2> 자스코드가 아니다</h2>   
        console.log('HTML코드 이후의 자스 출력문'); 
    </script>

</head>
<body>
    <h2>자바스크립트 첫 시간</h2>
    alert("자바스크립트 함수 입니다.");
</body>
</html>

먼저 바디 밖에다가 두는 코드를 작성 후 구현 해 보면

 

팝업창 뒤에 아무런 글자들이 보이지 않음!!

팝업창을 처리하지 않았기 때문에 뒤에 코드가 실행되지 않은것임

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScriptFirst.html</title>
</head>
<body>
    <h2>자바스크립트 첫 시간</h2>
    alert("자바스크립트 함수 입니다.");
    <script>
      alert("자바스크립트 함수 입니다.");  // 요기다가 두면 글자가 뒤쪽엔 보임
        // 이건 위에 코드 먼저 진행 된 후 팝업창이 뜨니까 글자가 보였던 것! 파이어폭스로 실행하면 보임
    </script>
</body>
</html>

그럼 이제 태그를 바디 안에다가 넣어보면

 

뒤에 글씨가 보이죠?? 코드 순서를 보면 저 글자들이 나온 뒤에 팝업창이 실행 되기 때문이다!!

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScriptFirst.html</title>
    <script> 
     alert("자바스크립트 함수 입니다.");  // 자스코드 O       
         // <h2> 자스코드가 아니다</h2>   // 자스코드X
        console.log('HTML코드 이후의 자스 출력문'); //자스코드O
    </script>

</head>
<body>
    <h2>자바스크립트 첫 시간</h2>
    alert("자바스크립트 함수 입니다.");
    <script>
       alert("자바스크립트 함수 입니다.");  // 팝업창 만드는 태그
    </script>
</body>
</html>

'학원 > JS' 카테고리의 다른 글

10/28 31-4 [JS] Array 주요 메소드 정리  (1) 2022.10.29
10/28 31-3 [JS] Array (for~ in문)  (0) 2022.10.28
10/27 30-6 [JS] Array  (1) 2022.10.27
10/27 30-6 [JS] Operator  (0) 2022.10.27
10/26 29-7 [JS] Variable01  (0) 2022.10.26

+ Recent posts

티스토리툴바