document.getElementById vs jQuery $ ()

Question

Это:

var contents = document.getElementById('contents');

То же, что и это:

var contents = $('#contents');

Учитывая, что загружен jQuery?

Answer 1

jQuery построен на JavaScript.Это означает, что в любом случае это просто javascript.

document.getElementById ()

Метод document.getElementById () возвращает элемент, имеющий атрибут ID суказанное значение и возвращает ноль, если не существует элементов с указанным идентификатором. Идентификатор должен быть уникальным на странице.

Jquery $ ()

Вызов jQuery () или $ () с селектором идентификатора в качестве аргумента вернет объект jQuery, содержащий коллекцию из нуля или одного элемента DOM. Каждое значение идентификатора должно использоваться только один раз в документе.Если более чем одному элементу был присвоен один и тот же идентификатор, запросы, использующие этот идентификатор, будут выбирать только первый соответствующий элемент в DOM.

Answer 2

Все ответы выше верны.Если вы хотите увидеть его в действии, не забывайте, что у вас есть консоль в браузере, где вы можете увидеть кристально чистый фактический результат:

У меня есть HTML:

<div id="contents"></div>

Перейдите на консоль (cntrl+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

Answer 3

Я разработал базу данных noSQL для хранения деревьев DOM в веб-браузерах, где ссылки на все элементы DOM на странице хранятся в кратком индексе.Таким образом, функция "getElementById ()" не нужна для получения / изменения элемента.Когда элементы в дереве DOM создаются на странице, база данных назначает суррогатные первичные ключи каждому элементу.Это бесплатный инструмент http://js2dx.com