자바스크립트 소개

자바스크립트란 무엇인가요?

JavaScript는 클라이언트 웹 페이지(브라우저) 개발에 널리 사용되는 스크립팅 언어로, 다양한 사용자 작업에 응답하는 등 HTML 웹 페이지에 동적 기능을 추가하는 데 사용됩니다.

JavaScript는 보안 기능을 갖춘 객체 및 이벤트 기반 스크립트 언어로 대부분의 경우 웹 브라우저에서 실행됩니다.

JavaScript는 미국 Sun Corporation의 등록 상표입니다. 현재 최신 버전의 Javascript는 Ecma International(구 European Computer Manufacturer Association)의 ECMA-262 표준(ECMAScript)을 따르는 버전입니다. 아직 개발 중입니다.

JavaScript 기능

스크립팅 언어

JavaScript는 작은 프로그램 세그먼트를 사용하여 프로그래밍을 구현하는 스크립팅 언어입니다. 다른 스크립팅 언어와 마찬가지로 JavaScript는 브라우저에서 실행될 때 한 줄씩 번역되는 해석 언어입니다.

객체 기반 언어

JavaScript는 객체 기반 언어이며 객체 지향으로 간주될 수도 있습니다. 즉, 자신이 만든 객체를 사용할 수 있다는 의미입니다. 따라서 스크립팅 환경의 개체 메서드와 스크립트의 상호 작용을 통해 많은 기능이 제공될 수 있습니다.

Simplicity

JavaScript 작성은 매우 간단합니다. 특정 개발 환경을 설치할 필요가 없으며 간단한 메모장만 있으면 JavaScript 스크립트를 작성할 수 있습니다. 기본적인 프로그램 구문과 언어 구조는 물론 약한 데이터 유형도 갖추고 있어 배우고 사용하기 쉽습니다.

Security

JavaScript는 보안 언어로 로컬 하드 디스크에 대한 액세스를 허용하지 않으며, 네트워크 문서의 수정 및 삭제만 허용합니다. 브라우저를 통해 액세스하면 정보 검색이나 동적 상호 작용을 구현하여 데이터 손실을 효과적으로 방지할 수 있습니다.

Dynamics

JavaScript는 동적이므로 웹 서비스 프로그램을 통하지 않고 사용자 입력에 직접 응답할 수 있습니다. 이벤트 기반 방식으로 사용자에게 응답합니다. 소위 이벤트 기반이란 웹 페이지에서 특정 작업을 수행함으로써 발생하는 동작을 의미하며 이를 "이벤트"라고 합니다. 예를 들어 마우스 누르기, 창 이동, 메뉴 선택 등으로 간주할 수 있습니다. 이벤트로. 이벤트가 발생하면 해당 JavaScript 이벤트 응답이 발생할 수 있습니다.

크로스 플랫폼

JavaScript는 웹 브라우저에 의해 실행되며 운영 체제 환경과 아무런 관련이 없으며 컴퓨터가 브라우저를 실행할 수 있고 브라우저가 JavaScript를 지원하는 한 올바르게 실행될 수 있습니다. .

HTML 출력에 직접 쓰기

<html>
<head>
  <script>
    alert('Hello, world');
  </script>
</head>
<body>
  <p>...</p>
</body>
</html>

이벤트에 대한 반응

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>
  <button type="button" onclick="alert('你好!')">点我!</button>
</body>
</html>

HTML 콘텐츠 변경

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
    <p id="demo">
    内容。
    </p>
    <script>
    function myFunction()
    {
    x=document.getElementById("demo");  // 找到元素
    x.innerHTML="Hello JavaScript!";    // 改变内容
    }
    </script>
    <button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>

HTML 이미지 변경

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
    <script>
    function changeImage()
    {
    element=document.getElementById('myimage')
    if (element.src.match("bulbon"))
     {
      element.src="/images/pic_bulboff.gif";
      }
    else
       {
      element.src="/images/pic_bulbon.gif";
       }
    }
    </script>
    <img id="myimage" onclick="changeImage()"
    src="/images/pic_bulboff.gif" width="100" height="180">
    <p>点击灯泡查看效果</p>
</body>
</html>

HTML 스타일 변경

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
<p id="demo">
改变 HTML 的样式。
</p>
<script>
function myFunction()
{
x=document.getElementById("demo") // 找到元素
x.style.color="blue";          // 改变样式
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>

입력 확인

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
    <script type="text/javascript">
    function validate_email(field,alerttxt)
    {
    with (field)
    {
    apos=value.indexOf("@")
    dotpos=value.lastIndexOf(".")
    if (apos<1||dotpos-apos<2) 
     {alert(alerttxt);return false}
    else {return true}
    }
    }
    function validate_form(thisform)
    {
    with (thisform)
    {
    if (validate_email(email,"Not a valid e-mail address!")==false)
     {email.focus();return false}
    }
    }
    </script>
</head>
<body>
    <form action="submitpage.htm"onsubmit="return validate_form(this);" method="post">
    Email: <input type="text" name="email" size="30">
    <input type="submit" value="Submit"> 
    </form>
</body>
</html>

지속적인 학습

새로운 파일

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> function validate_email(field,alerttxt) { with (field) { apos=value.indexOf("@") dotpos=value.lastIndexOf(".") if (apos<1||dotpos-apos<2) {alert(alerttxt);return false} else {return true} } } function validate_form(thisform) { with (thisform) { if (validate_email(email,"Not a valid e-mail address!")==false) {email.focus();return false} } } </script> </head> <body> <form action="submitpage.htm"onsubmit="return validate_form(this);" method="post"> Email: <input type="text" name="email" size="30"> <input type="submit" value="Submit"> </form> </body> </html>

제출하다 코드 재설정

자동운전