jquery에서 $('#id')와 document.getElementById('id')의 차이점

저는 jquery의 $("#id")와 document.getElementByIdx_x("id")가 동일한 효과를 갖는다고 생각하곤 했습니다. 그런데 오늘 특수 효과를 적용하면서 이것이 아니라는 것을 알았습니다. 테스트 결과는 다음과 같습니다.

1.alert($("#p")) 는 [object Object]

2.alert(document.getElementById("p")) 을 얻습니다. [ object HTMLpElement]

3.alert($("#p")[0]) 또는 Alert($("#p").get(0)) 은 [object HTMLpElement]

를 가져옵니다.

이유 설명:

document.getElementById()는 DOM 객체를 반환하고 $()는 jQuery 객체를 반환합니다.

jQuery 객체란 무엇인가요?
---jQuery를 통해 DOM 객체를 래핑하여 생성된 객체입니다. jQuery 개체는 jQuery에 고유하며 jQuery에서 메서드를 사용할 수 있습니다.
예:
$("#test").html()은 다음을 의미합니다. ID가 test인 요소에서 html 코드를 가져옵니다. 그중 html()은 jQuery의 메소드입니다.
이 코드는 DOM을 사용하여 코드를 구현하는 것과 동일합니다:
document.getElementById("id").innerHTML; DOM 객체를 래핑한 후 jQuery 객체가 생성되지만 jQuery는 DOM 객체의 메소드를 사용할 수 없습니다. 마찬가지로 DOM 객체도 jQuery의 메소드를 사용할 수 없습니다. 오류를 신고하세요. 예: $("#test").innerHTML, document.getElementById("id").html() 및 기타 작성 방법이 잘못되었습니다. 또 주목해야 할 점은 #id를 선택자로 사용하여 얻은 jQuery 객체와 document.getElementById("id")로 얻은 DOM 객체가 동일하지 않다는 것입니다. 아래 둘 사이의 변환을 참조하세요.
또한 jQuery는 다르지만 관련되어 있지만 jQuery 객체와 DOM 객체
도 서로 변환될 수 있습니다. 둘을 변환하기 전에 먼저 규칙을 제시합니다. jQuery 쌍을 얻는 경우 그런 다음 변수 앞에 $를 추가합니다. 예: var $variab = jQuery object; DOM 객체를 얻으면 평소와 동일합니다. var variab = DOM 객체; 이 규칙은 설명과 구별의 편의를 위한 것일 뿐 실제 사용에서는 규정되지 않습니다.
jQuery 객체를 DOM 객체로 변환:

두 가지 변환 방법은 jQuery 객체를 DOM 객체로 변환합니다: [index] 및 .get(index) (1) jQuery 객체는 데이터 객체이며 전달될 수 있습니다. [index ] 메소드를 사용하여 해당 DOM 객체를 가져옵니다.
예: var $v =$("#v"); //jQuery 객체 var v=$v[0]; //DOM 객체
alert(v.checked) //이 확인란이 선택되어 있는지 감지합니다. ( 2) jQuery 자체는 .get(index) 메소드를 통해 해당 DOM 객체를 제공합니다.
예: var $v=$("#v") //jQuery 객체
var v=$v.get(0); //DOM 객체
alert(v.checked) //이 확인란이 선택되었는지 감지


DOM 객체가 jQuery 객체로 변환됨:

DOM 객체의 경우 $()를 사용하여 DOM 객체를 래핑하면 됩니다. jQuery 객체. $(DOM object)
예: var v=document.getElementById("v"); //DOM object var $v=$(v); //jQuery object 변환 후에는 어떤 jQuery 메서드라도 사용할 수 있습니다.
위의 방법을 통해
jQuery 객체와 DOM 객체
를 서로 마음대로 변환할 수 있습니다. 다시 한 번 강조할 점은 DOM 객체만이 DOM에서 메소드를 사용할 수 있고, jQuery 객체는 DOM에서 메소드를 사용할 수 없다는 점입니다.

기타 관련 사용법은 다음과 같습니다. 1. DOM 객체를 jQuery 객체로 변환

일반적인 Dom 객체는 $()를 통해 jQuery 객체로 변환할 수 있습니다.
예: $(document.getElementById("msg")) 반환되는 것은 jQuery 객체이며, jQuery 메소드를 사용할 수 있습니다.


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

jQuery 객체 자체가 컬렉션이기 때문입니다. 따라서 jQuery 객체를 Dom 객체로 변환하려면 항목 중 하나를 가져와야 하며 일반적으로 인덱스를 통해 검색할 수 있습니다.
예: $("#msg")[0], $("p").eq(1)[0], $("p").get()[1], $("td") [ 5] Dom 개체는 Dom에서 메서드를 사용할 수 있지만 더 이상 jQuery 메서드를 사용할 수 없습니다.

다음 쓰기 방법이 정확합니다:
$("#msg")[0].innerHTML; 0].innerHTML;
$("#msg").get(0).innerHTML;




3. 객체를 얻는 두 가지 방법:
있는 경우

　$('# formid')

이름으로

　document.getElementsByName('formName')[0]

　$("form[name=' 양식이름']")

jquery 고유 메서드:

document.getElementByI d ()는 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 object; DOM 객체를 얻으면 평소와 동일합니다. var variab = DOM 객체; 이 규칙은 설명과 구별의 편의를 위한 것일 뿐 실제 사용에서는 규정되지 않습니다.

jQuery 객체를 DOM 객체로 변환:

두 가지 변환 방법은 jQuery 객체를 DOM 객체로 변환합니다: [index] 및 .get(index) (1) jQuery 객체는 데이터 객체이며 전달될 수 있습니다. [index ] 메소드를 사용하여 해당 DOM 객체를 가져옵니다.
예: var $v =$("#v"); //jQuery 객체 var v=$v[0]; //DOM 객체
alert(v.checked) //이 확인란이 선택되어 있는지 감지합니다. ( 2) jQuery 자체는 .get(index) 메소드를 통해 해당 DOM 객체를 제공합니다.
예: var $v=$("#v") //jQuery 객체
var v=$v.get(0); //DOM 객체
alert(v.checked) //이 확인란이 선택되었는지 감지


DOM 객체가 jQuery 객체로 변환됨:

DOM 객체의 경우 $()를 사용하여 DOM 객체를 래핑하면 됩니다. jQuery 객체. $(DOM object)
예: var v=document.getElementById("v"); //DOM object var $v=$(v); //jQuery object 변환 후에는 어떤 jQuery 메서드라도 사용할 수 있습니다.
위의 방법을 통해 jQuery 객체와 DOM 객체를 마음대로 서로 변환할 수 있습니다. 다시 한 번 강조할 점은 DOM 객체만이 DOM에서 메소드를 사용할 수 있고, jQuery 객체는 DOM에서 메소드를 사용할 수 없다는 점입니다.

기타 관련 사용법은 다음과 같습니다.

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

일반적인 Dom 객체는 $()를 통해 jQuery 객체로 변환할 수 있습니다.
예: $(document.getElementById("msg")) 반환되는 것은 jQuery 객체이며, jQuery 메소드를 사용할 수 있습니다.


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

jQuery 객체 자체가 컬렉션이기 때문입니다. 따라서 jQuery 객체를 Dom 객체로 변환하려면 항목 중 하나를 가져와야 하며 일반적으로 인덱스를 통해 검색할 수 있습니다.
예: $("#msg")[0], $("p").eq(1)[0], $("p").get()[1], $("td") [ 5] Dom 개체는 Dom에서 메서드를 사용할 수 있지만 더 이상 jQuery 메서드를 사용할 수 없습니다.

다음 쓰기 방법이 정확합니다:
$("#msg")[0].innerHTML; 0].innerHTML;
$("#msg").get(0).innerHTML;




3. 객체를 얻는 두 가지 방법:
있는 경우

　$('# formid')

이름

　　document.getElementsByName('formName')[0]

　　$("form[name='formName']")

위 내용은 jquery에서 $('#id')와 document.getElementById('id')의 차이점의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!