>웹 프론트엔드 >JS 튜토리얼 >자바스크립트 코드를 사용하는 방법에는 여러 가지가 있습니다

자바스크립트 코드를 사용하는 방법에는 여러 가지가 있습니다

醉折花枝作酒筹
醉折花枝作酒筹원래의
2021-06-10 11:10:012947검색

Javascript 코드는 두 가지 방법으로 사용될 수 있습니다. 1. 직접 실행, 웹 페이지가 열릴 때 스크립트 태그 또는 연결된 js 파일에 정의된 모든 JavaScript 코드가 실행됩니다. 2. 이벤트 구동, 이벤트가 발생할 때; 특정 이벤트가 발생하면 특정 JavaScript 코드 조각이 실행됩니다.

자바스크립트 코드를 사용하는 방법에는 여러 가지가 있습니다

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

【JavaScript 실행 방법】

HTML 문서에 정의된 JavaScript 코드에는 직접 실행과 이벤트 기반의 두 가지 실행 방법이 있습니다. 直接执行、事件驱动。

直接执行:

当我们打开一个网页时,所有定义在 3f1c4e4b6b16bbbd69b2ee476dc4f83a 标签或链入的 js 文件中的JavaScript代码就会被执行。

需要注意的是,用 function 定义的函数是不被执行的,函数只有在遇到函数调用时才会执行。

例1:

<script type="text/javascript">
var d = new Date();
var m = d.getMonth();
if( m>=5 )
document.write( m );
</script>

以上JavaScript代码是裸放在 3f1c4e4b6b16bbbd69b2ee476dc4f83a 标签中的,当网页打开时,就立即执行。

例2:

<script type="text/javascript">
function getM()
{
var d = new Date();
var m = d.getMonth();
if( m>=5 )
document.write( m );
}
</script>
以上JavaScript代码定义的是函数,当网页打开时,函数中的代码不会被执行。当需要执行该函数时,需要使用函数调用。
<script type="text/javascript">
getM();
</script>

事件驱动:

직접 실행:

웹페이지를 열면 3f1c4e4b6b16bbbd69b2ee476dc4f83a 태그나 링크된 js 파일에 정의된 모든 JavaScript 코드가 실행됩니다.

function으로 정의된 함수는 실행되지 않는다는 점에 유의하세요. 함수는 함수 호출을 만났을 때만 실행됩니다.

예제 1:

<script type="text/javascript">
var count = 0;
function setCount()
{
count++;
if( count>=5 )
count = 0;
}
</script>
<button onclick="setCount()">计数</button>

위의 JavaScript 코드는 3f1c4e4b6b16bbbd69b2ee476dc4f83a 태그에 포함되어 있으며 웹페이지가 열리면 즉시 실행됩니다.

예 2:

<script type="text/javascript">
JS代码
</script>
이벤트 중심:

웹 페이지 열기, 마우스 클릭, 더블 클릭 등과 같은 이벤트가 발생하면 JavaScript 코드가 실행됩니다.

예:

<script type="text/javascript" src="js文件"></script>

이 예에서는 bb9345e55eb71822850ff156dfde57c8 태그가 버튼을 정의하고, onclick 속성은 마우스로 버튼을 클릭할 때 setCount() 함수에 응답하는 데 사용됩니다. 실행됩니다.

태그의 이벤트에 응답하는 속성을 이벤트 핸들러라고 하며 해당 값은 JavaScript 코드입니다.

일반 이벤트 핸들러:

onload:

웹페이지가 열릴 때 트리거됩니다. 이는 6c04bd5ca3fcae76e30b72ad730ca86d 및 f900b4fc197b16ab214eecf015bb6bd2 태그 내에서만 유효합니다.

이 이벤트는 일반적으로 일부 초기화 작업을 수행하는 데 사용됩니다.

onunload:

웹페이지가 닫힐 때 트리거됩니다. 이는 6c04bd5ca3fcae76e30b72ad730ca86d 및 f900b4fc197b16ab214eecf015bb6bd2 태그 내에서만 유효합니다.

이 이벤트는 일반적으로 일부 마무리 작업을 완료하는 데 사용됩니다.

onclick:

마우스를 클릭할 때 트리거됩니다. 컨트롤, 이미지, 텍스트, 하이퍼링크 등과 같은 개체에 사용할 수 있습니다.

이 이벤트는 마우스 클릭 작업에 응답하는 데 사용되며 가장 일반적으로 사용되는 이벤트 핸들러입니다.

ondblclick:

마우스를 두 번 클릭하면 트리거됩니다. 컨트롤, 이미지, 텍스트, 하이퍼링크 등과 같은 개체에 사용할 수 있습니다.

이 이벤트는 마우스 더블 클릭에 응답하는 데 사용됩니다.

onchange:

콘텐츠가 변경되면 트리거됩니다. 텍스트 상자, 목록 상자 등과 같은 개체에 사용할 수 있습니다.

이 이벤트는 일반적으로 텍스트 상자의 내용을 수정하는 사용자 작업에 응답하는 데 사용됩니다.

참고: 사용자가 텍스트 상자에 텍스트를 입력하면 onchange 이벤트가 트리거되지 않습니다. 이 이벤트는 사용자가 입력을 완료한 후 텍스트 상자 외부 영역을 클릭할 때만 트리거되어 텍스트 상자가 포커스를 잃게 됩니다. .

onselect:

콘텐츠가 선택되면 트리거됩니다. 텍스트 상자, 목록 상자 등과 같은 개체에 사용할 수 있습니다.

이 이벤트는 일반적으로 사용자가 텍스트 상자에서 콘텐츠를 선택하고 목록 상자에서 선택한 항목을 변경하는 등의 작업에 응답하는 데 사용됩니다.

위 내용은 가장 일반적으로 사용되는 이벤트 핸들러 중 일부에 불과합니다.

참고: 이벤트 핸들러는 JavaScript 코드가 아니라 HTML 속성이므로 대소문자를 구분하지 않지만, 소문자로 작성하는 습관을 길러야 합니다.

확장 정보:

[JavaScript 정의 방법]:

HTML 문서에 JavaScript 코드를 추가하는 방법에는 포함 및 링크의 두 가지 방법이 있습니다.

임베디드:

HTML 문서에 JavaScript 코드를 삽입합니다. 방법:

rrreee

JavaScript 코드는 3f1c4e4b6b16bbbd69b2ee476dc4f83a와 2cacc6d41bbb37262a98f745aa00fbf0 사이에 정의되어야 합니다.

3f1c4e4b6b16bbbd69b2ee476dc4f83a 태그는 머리 부분이나 본문 부분에 배치할 수 있습니다.

HTML 문서에서 JavaScript 코드는 여러 위치에 나타날 수 있으며 각 위치는 3f1c4e4b6b16bbbd69b2ee476dc4f83a 태그로 묶여야 합니다. 🎜🎜Link-in: 🎜🎜JavaScript 코드를 텍스트 파일에 넣으세요. 파일 확장자는 .js로 정의되어야 합니다. HTML 문서에 다음 태그를 추가하세요. 🎜rrreee🎜 src 속성은 파일의 주소를 지정하는 데 사용됩니다. 연결된 js 파일. 로컬 파일일 수도 있고 URL일 수도 있습니다. 🎜🎜링크를 사용하면 정의된 JavaScript 코드를 여러 웹페이지에서 공유할 수 있습니다. 🎜🎜【추천 학습: 🎜javascript 고급 튜토리얼🎜】🎜

위 내용은 자바스크립트 코드를 사용하는 방법에는 여러 가지가 있습니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.