> 웹 프론트엔드 > JS 튜토리얼 > HTML 문서에 JavaScript를 삽입하는 네 가지 방법

HTML 문서에 JavaScript를 삽입하는 네 가지 방법

青灯夜游
풀어 주다: 2018-10-08 15:49:46
앞으로
2011명이 탐색했습니다.

이 글에서는 주로 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"> &lt;script&gt; function displayTime(){ ... ... } window.onload = displayTime; &lt;/script&gt;</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:js;toolbar:false">&lt;script src=&quot;../../scripts/util.js&quot;&gt;&lt;/script&gt;</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 속성,

의 action 속성 또는 window.open()의 매개변수 등 일반 URL을 사용할 수 있는 모든 위치에 있을 수 있습니다. 방법.

하이퍼링크의 JavaScript URL은 다음과 같습니다.

<a href="javascript:new Date().toLocaleTimeString();" rel="external nofollow" > 
What time is it? 
</a>
로그인 후 복사

위는 이 장의 전체 내용입니다. 더 많은 관련 튜토리얼을 보려면 JavaScript 비디오 튜토리얼을 방문하세요.

위 내용은 HTML 문서에 JavaScript를 삽입하는 네 가지 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:jb51.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿