jQuery 객체란 무엇입니까? jQuery 객체를 DOM 객체 인스턴스로 변환하는 방법에 대한 자세한 설명

伊谢尔伦
풀어 주다: 2017-07-20 13:13:45
원래의
2076명이 탐색했습니다.

처음 jQuery를 배우기 시작하면 어떤 것이 jQuery 객체이고 어떤 것이 DOM 객체인지 구분하지 못할 수도 있습니다. DOM 개체에 대해서는 설명이 많지 않습니다. jQuery와 둘 사이의 변환에 중점을 두겠습니다.

jQuery 객체란 무엇인가요?

---jQuery를 통해 DOM 객체를 래핑하여 생성된 객체입니다. jQuery 개체는 jQuery에 고유하며 jQuery에서 메서드를 사용할 수 있습니다.

예:

$("#test").html()은 ID가 test인 요소에서 html 코드를 가져오는 것을 의미합니다. 그 중 html()은 jQuery의 메소드입니다

이 코드는 DOM을 사용하여 코드를 구현하는 것과 동일합니다.

document.getElementById("id").innerHTML;
jQuery 객체는 DOM 객체를 래핑한 후 생성되지만 , jQuery DOM 객체의 어떤 메소드도 사용할 수 없습니다. 마찬가지로 DOM 객체도 jQuery의 메소드를 무분별하게 사용할 경우 오류가 발생합니다. 예: $("#test").innerHTML, document.getElementById("id").html() 및 기타 작성 방법이 잘못되었습니다.

또 한 가지 주의할 점은 #id를 선택자로 사용하여 얻은 jQuery 개체와 document.getElementById("id")로 얻은 DOM 개체가 동일하지 않다는 것입니다. 아래 둘 사이의 변환을 참조하세요.

jQuery는 다르지만 서로 관련되어 있으므로 jQuery 개체와 DOM 개체도 서로 변환할 수 있습니다. 두 가지를 변환하기 전에 먼저 규칙을 만듭니다. jQuery 객체를 얻은 경우 다음과 같이 변수 앞에 $를 추가합니다. var $variab = jQuery 객체를 얻은 경우 다음과 같습니다. : var variab = DOM object; 이 규칙은 설명과 구별의 편의를 위한 것일 뿐 실제 사용에서는 규정되지 않습니다.

jQuery 객체를 DOM 객체로 변환:

jQuery 객체를 DOM 객체로 변환하는 두 가지 변환 방법: [index] 및 .get(index);

(1) jQuery 객체는 데이터 객체입니다. [index] 메소드를 통해 해당 DOM 객체를 가져올 수 있습니다.

예:


var $v =$("#v") ; //jQuery对象
var v=$v[0]; //DOM对象
alert(v.checked) //检测这个checkbox是否被选中
로그인 후 복사

(2) jQuery 자체는 .get(index) 메서드를 통해 해당 DOM 객체를 얻을 수 있습니다.

예:


var $v=$("#v"); //jQuery对象
var v=$v.get(0); //DOM对象
alert(v.checked) //检测这个checkbox是否被选中
로그인 후 복사

DOM 객체는 jQuery 객체로 변환됩니다.

DOM 객체의 경우 DOM 객체를 $()로 래핑하기만 하면 jQuery 객체를 얻을 수 있습니다. $(DOM object)

예:


var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象
로그인 후 복사

변환 후에는 jQuery 메소드를 마음대로 사용할 수 있습니다.

위의 방법을 통해 jQuery 객체와 DOM 객체를 임의로 서로 변환할 수 있습니다. 다시 한 번 강조할 점은 DOM 객체만이 DOM에서 메소드를 사용할 수 있고, jQuery 객체는 DOM에서 메소드를 사용할 수 없다는 점입니다.

위 내용은 jQuery 객체란 무엇입니까? jQuery 객체를 DOM 객체 인스턴스로 변환하는 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿