Jquery 및 DOM 개체에 대한 간략한 소개_jquery

jquery를 처음 배우시면 DOM 객체와 Jquery 객체를 구분하지 못하는 경우가 많습니다. 이들 간의 관계와 차이점을 간략하게 설명하겠습니다

1.DOM 객체(Document Object Model)

문서 객체 모델, 각 DOM은 트리로 표현될 수 있습니다. 예를 들어 다음은 간단한 웹 페이지 코드입니다.

DOM으로 표현:

JS에서 getelementsByTayName 또는 getelementsByTayId를 통해 트리의 노드를 가져올 수 있습니다. 이렇게 얻은 요소는 DOM 개체입니다. 예를 들면 다음과 같습니다.

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

var domobj=document.getelementsByTayName("Name") //Get DOM 객체
var objhtml=domobj.innerHTML;                                                                                                                                                     

2.Jquery 객체

Jquery 개체는 Jquery로 DOM 개체를 래핑하여 생성된 개체이며 Jquery의 메서드를 호출할 수 있습니다. 예:

$("#foo").HTML();

Jquery 객체는 DOM 객체의 어떤 메서드도 호출할 수 없습니다. 예:

코드 복사 코드는 다음과 같습니다.$("#foo") //오류가 발생합니다

3. DOM 개체와 Jquery 개체 간의 상호 변환

변환하기 전에 먼저 변수 정의 스타일을 지정해야 합니다. 예를 들어 Jquery 객체를 정의할 때 $ 기호를 추가합니다. 예:

 var $obj=Jquery对象

DOM 객체를 정의할 때 기호를 추가할 필요가 없습니다. 이렇게 하면 변수가 어떤 객체인지 구별하고 코드 가독성을 높이는 데 도움이 됩니다.

var domobj=DOM对象

Jquery 클래스 라이브러리에 원하는 메소드가 없거나 Jquery 메소드에 대해 명확하지 않은 경우 이를 DOM 객체로 변환할 수 있습니다. Jquery 객체를 DOM 객체로 변환하는 방법에는 2가지가 있습니다. -[색인]/get(색인)，

(1) jquery 객체는 배열 객체이며, [index]를 통해 DOM 객체를 얻습니다.

var $obj=$("#sc");
var obj=$obj[0];
alter(obj.checked);

(2) Jquery 자체에서 제공하는 또 다른 방법은 get(index)을 통해 DOM 객체를 얻는 것입니다. 예를 들면 다음과 같습니다.

var $obj=$("#sc");
var obj=$obj.get(0);
alter(obj.checked);

4. DOM 객체를 Jquery 객체로 변환

DOM 객체는 $()를 통해 Jquery 객체로 변환될 수 있습니다. 예:

var obj=document.getelementsByTayName("Name");
var $obj=$(obj);

위 내용은 이 글의 전체 내용입니다. 모두 마음에 드셨으면 좋겠습니다.