jQuery를 $ 대 document.getElementById를 ()

해결법

1.정확히!!

정확히!!
```
document.getElementById('contents'); //returns a HTML DOM Object

var contents = $('#contents');  //returns a jQuery Object
```
document.getElementById를, 당신은 객체의 첫 번째 요소를 jQuery 오브젝트에 액세스하고 얻을 수있는 jQuery를, 동일한 결과를 얻을 수 (자바 스크립트 객체는 연관 배열과 유사한 역할을 기억하십시오).
```
var contents = $('#contents')[0]; //returns a HTML DOM Object
```
2.아니.

아니.

document.getElementById를 ( 'ID')를 호출하면 원시 DOM 객체를 반환합니다.

$ ( '# 아이디')를 호출하면 DOM 객체를 래핑 및 jQuery를 방법을 제공하는 jQuery를 객체를 반환합니다.

따라서, 당신은 단지 $ () 호출에 CSS () 또는 애니메이션 ()와 같은 jQuery를 메서드를 호출 할 수 있습니다.

또한 jQuery를 개체를 반환하고 ( '# ID가') $에 해당되는 $ (document.getElementById를 ( 'ID')를) 쓸 수 있습니다.

당신은 ( '# 아이디') $를 작성하여 [0]을 jQuery를 개체에서 기본 DOM 객체를 얻을 수 있습니다.
3.같은 닫기 아니지만. 그들은 같은 요소를 얻고 있지만, jQuery를 버전은 jQuery를 객체에 싸여있다.

같은 닫기 아니지만. 그들은 같은 요소를 얻고 있지만, jQuery를 버전은 jQuery를 객체에 싸여있다.

등가이 될 것입니다
```
var contents = $('#contents').get(0);
```
아니면 이거
```
var contents = $('#contents')[0];
```
다음은 jQuery 오브젝트에서 요소를 가져옵니다.
4.속도의 차이에주의. 온 클릭 호출에 다음 코드를 연결합니다 :

속도의 차이에주의. 온 클릭 호출에 다음 코드를 연결합니다 :
```
function myfunc()
{
    var timer = new Date();
    
        for(var i = 0; i < 10000; i++)
        {
            //document.getElementById('myID');
            $('#myID')[0];
        }
    

    console.log('timer: ' + (new Date() - timer));
}
```
대체 한 아웃 주석 다음 다른 아웃 주석. 내 테스트에서,

한편,

물론, 그게 그렇게 간단한 상황 아마 사용의 용이성과 .animate 및 .fadeTo 같은 다른 멋진 것들 모두를 위해 jQuery를 사용하는 것이에 이상 만 반복이다. 그러나 네, 기술적에서 getElementById는 꽤 빠르다.
5.제 제 2 번째 항상의 jQuery 객체를 반환하는 반면 DOM 요소는 null. 내용의 ID를 가진 요소가 일치하지 않은 경우 jQuery 오브젝트는 비어 있습니다.

제 제 2 번째 항상의 jQuery 객체를 반환하는 반면 DOM 요소는 null. 내용의 ID를 가진 요소가 일치하지 않은 경우 jQuery 오브젝트는 비어 있습니다.

document.getElementById를 ( '내용')에 의해 반환되는 DOM의 요소는 같은 .innerHTML (또는 .value) 등이, 그러나 당신이 jQuery 오브젝트에 jQuery를 방법을 사용해야합니다 변경 등의 작업을 수행 할 수 있습니다.
```
var contents = $('#contents').get(0);
```
더 equivilent, 내용의 ID를 가진 요소가 일치하지 않는 경우 그러나, document.getElementById를 ( '내용') 반환 널 (null)하지만, $ ( '# 내용은')입니다. 정의되지 않은 반환됩니다 (0)를 얻는다.

jQuery 오브젝트를 사용하는 방법에 대한 한 가지 이점은 어떤 요소가 반환되지 않은 경우 개체가 항상 반환되는대로 오류를 얻을 것입니다. 당신은 document.getElementById를에 의해 반환 된 널 (null)에 대한 작업을 수행 할 경우 당신은 오류를 얻을 것이다
6.아니, 실제로 같은 결과는 다음과 같습니다

아니, 실제로 같은 결과는 다음과 같습니다
```
$('#contents')[0] 
```
jQuery를 쿼리에서 반환 얼마나 많은 결과를 알 수 없습니다. 당신이 돌아 가야하는 것은 쿼리와 일치하는 컨트롤 모두의 컬렉션을하는 특별한 jQuery를 개체입니다.

jQuery를 매우 편리하게 만드는 것 중 하나는 그들이 모습이 하나의 제어를 위해 의미하는 것으로이 객체에서 호출 대부분의 방법은, 그에게 수집을 int로 모든 구성원 호출 루프에서 실제로 있다는 것입니다

사용자가 [0] 구문을 사용할 때 내부 컬렉션에서 첫 번째 요소를 가지고. 이 시점에서 당신은 DOM 객체를 가져
7.경우 다른 사람이 안타에 ... 여기에 또 다른 차이점 :

경우 다른 사람이 안타에 ... 여기에 또 다른 차이점 :

ID가 HTML 표준에서 지원하지 않는 문자가 포함 된 경우, jQuery를가에서 getElementById가하는 경우에도 그것을 찾을 수 없습니다 (여기 SO 질문 참조).

사용하는 크롬 : ( "A / B / C를"ID = 예)이 포함 된 "/"문자 ID로 내게 일어난 :
```
var contents = document.getElementById('a/b/c');
```
내 요소을 찾을 수 있었다 :
```
var contents = $('#a/b/c');
```
하지 않았다.

사이의 간단한 수정은 이름 필드에 해당 ID를 이동했다. JQuery와 사용하여 요소를 찾는데 문제가 없었다 :
```
var contents = $('.myclass[name='a/b/c']);
```
8.대부분의 사람들이 말한 것처럼, 주요 차이점은 바로 자바 스크립트를 사용하여 원시 DOM 객체 대 jQuery를 호출와 jQuery를 객체에 싸여 있다는 사실이다. jQuery 오브젝트는 그냥 기본 스타일 또는 기본 이벤트 처리와 같은 간단한 DOM 조작을 할 필요가있는 경우, 물론 그것으로 다른 jQuery를 기능을하지만, 할 수있을 것입니다, 직선 자바 스크립트 방법은 조금 당신이 '돈 때문에 jQuery를보다 빠르게 비트 항상 t는 자바 스크립트에 내장 된 코드의 외부 라이브러리를로드해야합니다. 그것은 추가 단계를 절약 할 수 있습니다.

대부분의 사람들이 말한 것처럼, 주요 차이점은 바로 자바 스크립트를 사용하여 원시 DOM 객체 대 jQuery를 호출와 jQuery를 객체에 싸여 있다는 사실이다. jQuery 오브젝트는 그냥 기본 스타일 또는 기본 이벤트 처리와 같은 간단한 DOM 조작을 할 필요가있는 경우, 물론 그것으로 다른 jQuery를 기능을하지만, 할 수있을 것입니다, 직선 자바 스크립트 방법은 조금 당신이 '돈 때문에 jQuery를보다 빠르게 비트 항상 t는 자바 스크립트에 내장 된 코드의 외부 라이브러리를로드해야합니다. 그것은 추가 단계를 절약 할 수 있습니다.
9.VAR 함량 = document.getElementById를 ( '내용');

VAR 함량 = document.getElementById를 ( '내용');

VAR 내용 = $ ( '# 내용');

코드 조각은 동일하지 않습니다. 첫 번째는 Element 객체 (소스)를 반환합니다. 두 번째는, jQuery를 상응 0 또는 1 중 DOM 요소의 집합체를 포함하고있는 jQuery 객체를 리턴한다. (jQuery를 문서). 내부적으로 jQuery를 효율성에 대한 document.getElementById를 ()를 사용합니다.

두 경우에 두 개 이상의 요소는 첫 번째 요소가 반환됩니다 발견합니다.

document.getElementById를 코드를 사용하고있는 것으로 보인다 라인 조각 다음 jQuery를 I에 대한 GitHub의 프로젝트를 발견 검토 (https://github.com/jquery/jquery/blob/master/src/core/init.js 라인 68 년 이후)
```
// HANDLE: $(#id)
} else {
    elem = document.getElementById( match[2] );
```
10.또 다른 차이점은 : - 네, 같은 ID가 HTML 문서에서 반복 할 수 $은 ( '#이 ...') 일치의 컬렉션을 반환하는 동안에서 getElementById는 첫 번째 일치를 반환합니다.

또 다른 차이점은 : - 네, 같은 ID가 HTML 문서에서 반복 할 수 $은 ( '#이 ...') 일치의 컬렉션을 반환하는 동안에서 getElementById는 첫 번째 일치를 반환합니다.

또한, getElementId는 선택기에서 호출 할 수 있습니다 ( '... #') $ 동안 문서에서 호출됩니다. 따라서, 아래의 코드에서 document.getElementById를 ( '콘텐츠')는 전신하지만 $ ( '모양 #content') [0] 폼 내부 반환을 반환한다.
```
<body id="content">
   <h1>Header!</h1>
   <form>
      <div id="content"> My Form </div>
   </form>
</body>
```
그것은 중복 ID를 사용하는 것이 이상하게 보일 수도 있지만, 당신은 워드 프레스 같은 것을 사용하는 경우가 콘텐츠에 사용할 때, 템플릿 또는 플러그인은 동일한 ID를 사용할 수 있습니다. jQuery를의 선택이 당신을 도울 수 있습니다.
11.jQuery를 자바 스크립트를 통해 내장되어 있습니다. 이 방법은 그냥 어쨌든 JavaScript의 것을.

jQuery를 자바 스크립트를 통해 내장되어 있습니다. 이 방법은 그냥 어쨌든 JavaScript의 것을.

document.getElementById를 ()

JQuery와 $ ()
12.직접 액세스 ID가 자바 스크립트 filds을 키 입력 할 수 있습니다 2019의 모든 답변은 단순히 그것을 시도 오늘 오래된

직접 액세스 ID가 자바 스크립트 filds을 키 입력 할 수 있습니다 2019의 모든 답변은 단순히 그것을 시도 오늘 오래된
```
<p id="mytext"></p>
<script>mytext.innerText = 'Yes that works!'</script>
```
온라인 데모! - https://codepen.io/frank-dspeed/pen/mdywbre
13.나는 페이지의 모든 DOM 요소에 대한 참조가 짧은 인덱스에 저장되는 웹 브라우저에서 DOM 트리를 저장하는 형 NoSQL 데이터베이스를 개발했다. 따라서 기능 "에서 getElementById는 ()"/ 얻을 요소를 수정하는 데 필요하지 않습니다. DOM 트리의 요소가 페이지에서 인스턴스화하는 경우 데이터베이스 양수인은 각 요소에 대한 기본 키를 대리. 그것은 http://js2dx.com 무료 도구입니다

나는 페이지의 모든 DOM 요소에 대한 참조가 짧은 인덱스에 저장되는 웹 브라우저에서 DOM 트리를 저장하는 형 NoSQL 데이터베이스를 개발했다. 따라서 기능 "에서 getElementById는 ()"/ 얻을 요소를 수정하는 데 필요하지 않습니다. DOM 트리의 요소가 페이지에서 인스턴스화하는 경우 데이터베이스 양수인은 각 요소에 대한 기본 키를 대리. 그것은 http://js2dx.com 무료 도구입니다
14.모든 해답은 위 정확합니다. 경우에 당신은 당신이 명확 실제 결과 결정을 볼 수있는 브라우저에서 콘솔을 잊지 말고, 행동을보고 싶어 :

모든 해답은 위 정확합니다. 경우에 당신은 당신이 명확 실제 결과 결정을 볼 수있는 브라우저에서 콘솔을 잊지 말고, 행동을보고 싶어 :

나는 HTML을 가지고 :
```
<div id="contents"></div>
```
콘솔 (Ctrl + Shift + C)로 이동하여 결과를 명확하게 보려면 다음 명령을 사용하여
```
document.getElementById('contents')
>>> div#contents

$('#contents')
>>> [div#contents,
 context: document,
 selector: "#contents",
 jquery: "1.10.1",
 constructor: function,
 init: function …]
```
우리가 볼 수 있듯이, 첫 번째 경우에 우리는 (엄격하게 HTMLDivElement와 객체, 말하기,이다) 태그 자체를 얻었다. 후자에서 우리는 실제로 일반 객체하지만, 객체의 배열이 없습니다. 위의 다른 답변에서 언급 한 바와 같이, 당신은 다음과 같은 명령을 사용할 수 있습니다 :
```
$('#contents')[0]
>>> div#contents
```

from https://stackoverflow.com/questions/4069982/document-getelementbyid-vs-jquery by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] jQuery로 구문 분석 RSS (0)	2020.10.10
[JQUERY] 구글의 CDN에서 jQuery를 UI CSS를 다운로드 (0)	2020.10.10
[JQUERY] 새 행이있는 jqGrid에 추가 된 후 어떻게 loadComplete을 발사? (0)	2020.10.10
[JQUERY] 왜 크롬 지역 jQuery를 쿠키를 무시합니까? (0)	2020.10.10
[JQUERY] 어떻게 jQuery를 작업은 동일한 ID 값을 가진 여러 요소가있을 때입니까? (0)	2020.10.10

복붙노트

[JQUERY] jQuery를 $ 대 document.getElementById를 ()

jQuery를 $ 대 document.getElementById를 ()

해결법

1.정확히!!

2.아니.

3.같은 닫기 아니지만. 그들은 같은 요소를 얻고 있지만, jQuery를 버전은 jQuery를 객체에 싸여있다.

4.속도의 차이에주의. 온 클릭 호출에 다음 코드를 연결합니다 :

5.제 제 2 번째 항상의 jQuery 객체를 반환하는 반면 DOM 요소는 null. 내용의 ID를 가진 요소가 일치하지 않은 경우 jQuery 오브젝트는 비어 있습니다.

6.아니, 실제로 같은 결과는 다음과 같습니다

7.경우 다른 사람이 안타에 ... 여기에 또 다른 차이점 :

9.VAR 함량 = document.getElementById를 ( '내용');

10.또 다른 차이점은 : - 네, 같은 ID가 HTML 문서에서 반복 할 수 $은 ( '#이 ...') 일치의 컬렉션을 반환하는 동안에서 getElementById는 첫 번째 일치를 반환합니다.

11.jQuery를 자바 스크립트를 통해 내장되어 있습니다. 이 방법은 그냥 어쨌든 JavaScript의 것을.

12.직접 액세스 ID가 자바 스크립트 filds을 키 입력 할 수 있습니다 2019의 모든 답변은 단순히 그것을 시도 오늘 오래된

14.모든 해답은 위 정확합니다. 경우에 당신은 당신이 명확 실제 결과 결정을 볼 수있는 브라우저에서 콘솔을 잊지 말고, 행동을보고 싶어 :

'JQUERY' 카테고리의 다른 글

티스토리툴바