jQuery 문법

jQuery를 통해 HTML 요소를 선택하고（조사，query），그들에 대해 '작업'을 수행할 수 있습니다。

jQuery 문법 예제

$("this").hide()
jQuery hide() 함수를 보여주는 예제, 현재 HTML 요소를 숨깁니다。
$("#test").hide()
jQuery hide() 함수를 보여주는 예제, id="test"의 요소를 숨깁니다。
$("p").hide()
jQuery hide() 함수를 보여주는 예제, <p> 요소를 숨깁니다。
$(".test").hide()
jQuery hide() 함수를 보여주는 예제, class="test"의 모든 요소를 숨깁니다。

jQuery 문법

jQuery 문법은 HTML 요소를 선택하기 위한 것이며, 요소에 대해 특정 작업을 수행할 수 있습니다。

기본 문법은 다음과 같습니다：$ (selector).action ()

  • 달러 심볼은 jQuery를 정의합니다
  • 선택자（selector）“조사”와“검색”HTML 요소
  • jQuery의 action()은 요소에 대한 작업을 수행합니다

예제

$("this").hide() - 현재 요소를 숨깁니다

$("p").hide() - 모든 구절을 숨깁니다

$(".test").hide() - class="test"의 모든 요소를 숨깁니다

$("#test").hide() - id="test"의 모든 요소를 숨깁니다

팁：jQuery가 사용하는 문법은 XPath와 CSS 선택자 문법의 조합입니다. 이 튜토리얼의 다음 장에서는 선택자 문법에 대해 더 많이 배울 수 있습니다。

문档 준비 함수

그러나 여러분은 우리의 예제에서 모든 jQuery 함수가 하나의 document ready 함수 안에 위치하는 것을 이미 알고 있을 것입니다：

$(document).ready(function(){
  // jQuery 함수를 여기에 넣습니다
});

이는 문档이 완전히 로드되고 (준비되었을 때) jQuery 코드를 실행하는 것을 방지하기 위한 것입니다。

문档이 완전히 로드되지 않은 상태에서 함수를 실행하면, 작업이 실패할 수 있습니다. 두 가지 구체적인 예제가 다음과 같습니다：

  • 존재하지 않는 요소를 숨기려고 시도
  • 미완전 로드된 이미지의 크기를 얻기 위해 시도