jQuery 객체와 DOM 객체 간 변환 방법 소개_jquery

jQuery 객체와 DOM 객체의 교환에 대해 논의하기 전에 먼저 변수 정의 스타일에 동의하세요. 획득한 개체가 jQuery 개체인 경우 변수 앞에 $를 추가합니다. 예:

코드 복사 코드는 다음과 같습니다.

var $variable = jQuery 객체;

DOM 객체를 얻으면 다음과 같이 정의됩니다.

코드 복사 코드는 다음과 같습니다.

var 변수 = DOM 객체;

1. jQuery 객체를 DOM 객체로 변환

jQuery 객체는 DOM에서 메소드를 사용할 수 없지만, jQuery 객체가 제공하는 메소드에 익숙하지 않거나, jQuery가 원하는 메소드를 캡슐화하지 않아 DOM 객체를 사용해야 하는 경우에는 아래 두 가지 메소드가 있습니다. jQuery는 jQuery 객체를 DOm 객체로 변환하는 두 가지 방법, 즉 [index] 및 get(index)를 제공합니다.

(1) jQuery 객체는 배열 객체이며, [index] 메소드를 통해 해당 DOM 객체를 얻을 수 있습니다.

jQuery 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

var $cr = $("#cr"); //jQuery 객체
var cr = $cr[0] //DOM 객체
Alert(cr.checked) //체크박스가 체크되어 있는지 확인

(2) 또 다른 메소드는 jQuery 자체에서 제공하며, get(index) 메소드를 통해 해당 DOM 객체를 얻습니다.

jQuery 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

[js]var $cr = $("#cr");
var cr = $cr.get(0);
알림(cr.확인됨)

2. DOM 객체를 jQuery 객체로 변환

DOM 객체의 경우 jQuery 객체를 얻으려면 DOM 객체를 $()로 래핑하기만 하면 됩니다. 메소드는 $(DOM 객체)입니다.

jQuery 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

var cr = document.getElementByID("cr"); //DOM 객체
var $cr = $(cr);

변환 후에는 jQuery에서 어떤 메서드든 사용할 수 있습니다.

위의 방법을 통해 jQuery 객체와 DOM 객체를 임의로 서로 변환할 수 있습니다.

마지막으로 DOM 객체만 DOM에서 메서드를 사용할 수 있다는 점을 강조합니다. jQuery 객체는 DOM에서 메서드를 사용할 수 없지만 jQuery 객체는 DOM 운영을 위한 보다 완전한 도구 세트를 제공합니다.