English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

jQuery 문법

jQuery 문법은 HTML 요소를 사용하여 정의됩니다선택자진행되며 요소에 대한 일부 작업을 수행합니다작업.

jQuery 기본 문법:

$(selector).action()
  • $ 기호는 jQuery를 정의합니다

  • (selector)는 HTML 요소를 찾는 데 사용됩니다

  • action()는 요소에 대한 작업을 수행하는 데 사용됩니다

예제:

$("this").hide():현재 요소를 숨기는 데 사용됩니다

$("p").hide():모든<p>요소

$(".para").hide():class="para"를 가진 모든 요소를 숨기는 데 사용됩니다

$("#para").hide():id="para"의 요소를 숨기는 데 사용됩니다

jQuery는 CSS 문법을 사용하여 요소를 선택합니다. 다음 장에서는 jQuery 선택자에 대해 더 알아보겠습니다.

문서 준비 이벤트

지금까지의 예제에서 모든 jQuery 메서드가 document.ready 이벤트에서 사용되고 있다는 것을 주목했을 가능성이 큽니다:

$(document).ready(function(){
  // jQuery 메서드(DOM이 준비되면 실행)
  
  });

이는 문档 로드가 완료되기 전에 jQuery 코드를 실행하지 않도록 하는 것입니다.

올바른 방법은 문档이 완전히 로드되고 준비되면 그 후에 사용하는 것입니다.

이는 문档 본문의 시작 부분에서 JavaScript 코드를 가져올 수 있게 합니다.

문档이 완전히 로드되기 전에 메서드를 실행하면 다음과 같은 작업 실패 예제가 발생할 수 있습니다:

  • 아직 생성되지 않은 요소를 선택하기 시도

  • 아직 로드되지 않은 이미지의 크기를 가져오기 시도

jQuery는 document.ready 이벤트에 더 짧은 메서드를 제공합니다:

$(function(){
  // jQuery 메서드, 위와 같은 효과
  });

$(document).ready()를 통해 코드를 더 쉽게 읽을 수 있습니다.

주의:이 $(document).ready()는 페이지를 jQuery로 안전하게 조작하기 위한 이벤트입니다(이 이벤트의 코드는 DOM이 준비되기 전까지 실행되지 않습니다).