첫 번째 JavaScript 랩 - 코딩 배우기

소개

🧑‍💻 Linux 또는 LabEx 를 처음 사용하시나요? Quick Start with Linux 강좌부터 시작하는 것을 권장합니다.

안녕하세요, LabEx 에 오신 것을 환영합니다! 이 첫 번째 랩에서는 JavaScript 로 고전적인 "Hello, World!" 프로그램을 배우게 됩니다.

아래의 Continue 버튼을 클릭하여 랩을 시작하세요.

이것은 가이드 실험입니다. 학습과 실습을 돕기 위한 단계별 지침을 제공합니다.각 단계를 완료하고 실무 경험을 쌓기 위해 지침을 주의 깊게 따르세요. 과거 데이터에 따르면, 이것은 중급 레벨의 실험이며 완료율은 72%입니다.학습자들로부터 99%의 긍정적인 리뷰율을 받았습니다.

Hello JavaScript

JavaScript 는 웹사이트에 상호 작용을 추가할 수 있게 해주는 프로그래밍 언어입니다. 동적이고 상호 작용적인 웹 페이지를 만드는 데 사용됩니다. 객체 지향 기능을 갖춘 인터프리터 방식의 프로그래밍 언어입니다.

버튼을 클릭하면 메시지를 표시하는 간단한 웹 페이지를 JavaScript 를 사용하여 만들 것입니다.

index.html이 WebIDE 에 생성되었습니다. 이를 열고 다음 코드를 추가하십시오.

<!doctype html>
<html>
  <head>
    <title>Hello, World!</title>
  </head>
  <body>
    <h1 id="message">Click the button to display the message!</h1>

    <button onclick="displayMessage()">Click me</button>

    <script>
      function displayMessage() {
        document.getElementById("message").textContent = "Hello, JavaScript!";
      }
    </script>
  </body>
</html>

위의 코드는 버튼을 클릭하면 메시지를 표시합니다. 메시지는 id 가 message인 h1 요소에 표시됩니다.

onclick 속성은 버튼을 클릭했을 때 displayMessage() 함수를 호출하는 데 사용됩니다. displayMessage() 함수는 h1 요소의 텍스트 내용을 "Hello, JavaScript!"로 변경합니다.

그런 다음 오른쪽 하단 모서리에 있는 Go Live 버튼을 클릭하면 8080 포트에서 로컬 웹 서버가 실행됩니다.

이제 Web 8080 탭으로 전환하여 새로 고침 버튼을 클릭하면 변경 사항을 확인할 수 있습니다.

요약

축하합니다! 첫 번째 LabEx 랩을 완료했습니다.

LabEx 에 대해 더 자세히 알아보고 사용 방법을 알고 싶다면 지원 센터를 방문하십시오. 또는 비디오를 시청하여 LabEx 에 대해 자세히 알아볼 수 있습니다.

프로그래밍은 긴 여정이지만, Next Lab은 클릭 한 번으로 시작할 수 있습니다. 시작해 봅시다!