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>

프로그래밍 | 카테고리의 다른 글

  • jQuery 이벤트  (0)
  • 2017.08.16
  • jQuery 문서 객체 조작  (0)
  • 2017.08.14
  • jQuery 라이브러리 설정  (0)
  • 2017.08.14
  • 문서 객체 모델 - 이벤트  (0)
  • 2017.08.11
  • 문서 객체 모델  (0)
  • 2017.08.09
    TAGS.

    Comments