jQuery 문서 객체 선택
jQuery 라이브러리는 다음 형태로 사용합니다.
$(선택자). 메소드(매개 변수, 매개 변수)
[그림 11-3] jQuery 라이브러리 메소드의 기본 형태
[그림 11-3]의 왼ㅇ쪽에 있는 $() 함수의 형태 때문에 익숙하지 않을 수 있습니다. 자바스크립트는 식별자로 특수 문자 $와 _를 사용할 수 있습니다. 따라서 $() 함수는 별도의 특별한 기능이 아니라 단순한 함수입니다.
jQuery()는 jQuery 라이브러리의 기본 함수라 많이 사용하는데, 쉽게 사용할 수 있도록 다음 코드처럼 변수를 대치합니다.
// Expose jQuery to the global object
window.jQuery = window.$ = jQuery;
Tip_ 라이브러리에 있는 내용
기본 예제 11-2 문서 객체 선택
jQuery 라이브러리를 사용하면 이전 장에서 살펴본 방법보다 훨씬 쉽게 문서 객체를 선택할 수있습니다. 다음 코드는 문서 객체를 선택해 스타일을 지정합니다. qeuryselectorAll() 메소드와 달리 반복문을 사용하지 않아도 됩니다.
[코드 11-2] 문서 객체 선택
<!DOCTYPE html>
<html>
<head>
<title>jquery Basic</title>
<script src="https://code.jqeury.com/jqeury-3.1.1js"></script>
<script>
// 이벤트를 연결합니다.
$(document).ready(function () {
// 스타일 속성을 변경합니다.
$('h1').css('color', 'red');
$('h1).css('background', 'black');
});
</head>
<body>
<h1>Header</h1>
<h1>Header</h1>
<h1>Header</h1>
</body>
</html>