HTML 문서에 JavaScript를 삽입하는 네 가지 방법
이 글에서는 주로 HTML 문서에 클라이언트측 JavaScript 코드를 삽입하는 4가지 방법을 소개합니다. 관심 있는 친구들은 다음과 같이 참고할 수 있습니다:
Embedding JavaScript in HTML
HTML 문서에 클라이언트를 삽입하는 방법에는 4가지가 있습니다. 사이드 JavaScript 코드:
1. <script> 태그와 </script> 태그 사이에 위치(적음)
2. src 속성으로 지정된 외부 파일에 위치 more);
3. onclick 또는 onmouseover와 같은 HTML 속성 값으로 지정하는 HTML 이벤트 핸들러에 배치됩니다(드물게).
4. URL에 배치되면 특수 프로토콜 "javascript"가 사용됩니다. 프로토콜(드물게)
1 - 첨부: 스크립트 유형
JavaScript는 기본적으로 웹의 원래 스크립트 언어입니다. < VBScript와 같은 비표준 스크립트 언어를 사용하려면 type 속성을 사용하여 스크립트의 MIME 유형을 지정해야 합니다. 예:
<script type="text/vbscript"> ... ... </script>
type 속성의 기본값은 "text/javascript" ".
2 - 인라인 <script> 요소 </span></p><p> 예: </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'> <script> function displayTime(){ ... ... } window.onload = displayTime; </script></pre><div class="contentsignin">로그인 후 복사</div></div><p><span style="color: #0000ff">3 - src 속성은 외부 파일의 스크립트를 사용합니다. </span></p><p><script> 태그는 src 속성을 지원합니다. JavaScript 코드 파일의 사용법은 다음과 같습니다: </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'><script src="../../scripts/util.js"></script></pre><div class="contentsignin">로그인 후 복사</div></div><p>src 속성을 사용할 때 <script></script> 태그 사이의 모든 내용은 무시됩니다.
src 속성을 사용하여 페이지에 스크립트를 포함하면 스크립트에 웹 페이지에 대한 모든 권한이 부여됩니다.
4 - HTML의 이벤트 핸들러
스크립트가 있는 HTML 파일이 브라우저에 로드되면 이 스크립트의 JavaScript 코드는 한 번만 실행됩니다. JavaScript 코드는 Element 객체의 속성에 함수를 할당하여 이벤트 핸들러를 등록할 수 있습니다. 이 Element 개체는 문서의 HTML 요소를 나타냅니다.
예:
<input type="checkbox" name="options" value="giftwrap" onchange="order.options.giftwrap = this.checked;">
HTML에 정의된 이벤트 핸들러의 속성에는 쉼표로 구분된 모든 JavaScript 문이 포함될 수 있습니다. 이러한 문은 함수의 본문을 형성하며, 이는 해당 이벤트 핸들러 속성의 값이 됩니다.
4 - URL의 JavaScript
javascript: 프로토콜 한정자가 있는 URL을 따르는 것은 클라이언트에 JavaScript 코드를 삽입하는 또 다른 방법입니다. 이 특수 프로토콜 유형은 URL 콘텐츠가 JavaScript 인터프리터에 의해 실행되는 JavaScript 코드인 임의의 문자열임을 지정합니다. 이는 별도의 코드 줄로 처리됩니다. 즉, 명령문은 세미콜론으로 구분되어야 하고 주석은 /**/ 주석으로 대체되어야 합니다. javascript:URL로 식별할 수 있는 리소스는 실행된 코드가 문자열로 변환되어 반환되는 값이다. 코드가 정의되지 않음을 반환하면 리소스에 콘텐츠가 없는 것입니다.
javascript: URL은 태그의 href 속성,
하이퍼링크의 JavaScript URL은 다음과 같습니다.
<a href="javascript:new Date().toLocaleTimeString();" rel="external nofollow" > What time is it? </a>
위는 이 장의 전체 내용입니다. 더 많은 관련 튜토리얼을 보려면 JavaScript 비디오 튜토리얼을 방문하세요.
위 내용은 HTML 문서에 JavaScript를 삽입하는 네 가지 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

핫 AI 도구

Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool
무료로 이미지를 벗다

Clothoff.io
AI 옷 제거제

Video Face Swap
완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

인기 기사

뜨거운 도구

메모장++7.3.1
사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경

드림위버 CS6
시각적 웹 개발 도구

SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)

뜨거운 주제











HTML의 테이블 테두리 안내. 여기에서는 HTML의 테이블 테두리 예제를 사용하여 테이블 테두리를 정의하는 여러 가지 방법을 논의합니다.

HTML의 Nested Table에 대한 안내입니다. 여기에서는 각 예와 함께 테이블 내에 테이블을 만드는 방법을 설명합니다.

HTML 여백-왼쪽 안내. 여기에서는 HTML margin-left에 대한 간략한 개요와 코드 구현과 함께 예제를 논의합니다.

HTML 테이블 레이아웃 안내. 여기에서는 HTML 테이블 레이아웃의 값에 대해 예제 및 출력 n 세부 사항과 함께 논의합니다.

HTML 입력 자리 표시자 안내. 여기서는 코드 및 출력과 함께 HTML 입력 자리 표시자의 예를 논의합니다.

HTML에서 텍스트 이동 안내. 여기서는 Marquee 태그가 구문과 함께 작동하는 방식과 구현할 예제에 대해 소개합니다.

HTML 순서 목록에 대한 안내입니다. 여기서는 HTML Ordered 목록 및 유형에 대한 소개와 각각의 예에 대해서도 설명합니다.

HTML onclick 버튼에 대한 안내입니다. 여기에서는 각각의 소개, 작업, 예제 및 다양한 이벤트의 onclick 이벤트에 대해 설명합니다.
