Разница между getElementById и jquery $('# smth')

Чем отличается классический код Javascript:

document.getElementById('theID')

и версию jQuery:

$('#theID')

ОТВЕТЫ

Ответ 1

document.getElementById возвращает объект DOM. Это браузерный способ мышления об элементе на странице. Он имеет различные методы и свойства. Они могут быть немного неуклюжими в использовании.

Объект jQuery (созданный методом $) является оберткой вокруг элемента DOM или набора элементов DOM. Обычные свойства и методы недоступны; вы получаете несколько различных методов, которые делают процесс DOM-манипуляции более интуитивным.

Разница более очевидна, если вы видите несколько элементов в элементе выбора (например, как вы бы выбрали селектор классов $('.someClass')), но методы в выборе jQuery отличаются от методов на собственном элементе DOM. указывают на одно и то же, но это разные способы мышления и борьбы с ним.

В качестве последней заметки вы можете преобразовать выбор jQuery в свой собственный элемент DOM с помощью метода get (изменить: или альтернативный синтаксис, подобный массиву). Так

document.getElementById('theID')

точно совпадает с

$('#theID').get(0) // or $('#theId')[0]

Обратите внимание, однако, что вы должны использовать первое, так как оно имеет гораздо лучшую производительность. Используйте только jQuery, если вам нужна дополнительная функциональность, которую он предоставляет.

Ответ 2

В вашем втором проекте вы, возможно, не включили файлы jQuery вверху.

Ответ 3

Обязательно включите

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

В <head>

Если вы не загрузите jQuery, вы не сможете использовать $, поскольку jQuery - это внешняя библиотека, а не часть JavaScript.

Ответ 4

Не совсем: Если элемент с этим идентификатором отсутствует на странице $ ( "# id" ) не будет работать, а script остановится document.getElementById( "id" ) вернет null

Ответ 5

Между этими двумя имеются следующие различия.

  1. Селектор jQuery #id использует JavaScript document.getElementById() функция
  2. Функция JavaScript document.getElementById() выдает ошибку, если элемент с указанным идентификатором не найден, тогда как jQuery #id селектор не выдаст ошибку. Чтобы проверить, возвращается ли элемент селектором #id, используйте свойство length.
  3. Селектор JavaScript document.getElementById() и jQuery (#id) являются не то же самое. document.getElementById() возвращает необработанный объект DOM где селектор jQuery ('# id') возвращает объект jQuery, который переносится объект DOM и предоставляет методы jQuery. Это причина, по которой вы способны вызывать такие методы jQuery, как css(), click() для объекта возвращается JQuery. Чтобы получить базовый объект DOM из jQuery запись объекта $('#id')[0]
  4. document.getElementById() работает быстрее, чем селектор jQuery ('# id'). использование document.getElementById() через селектор jQuery ('# id'), если вы нужна дополнительная функциональность, предоставляемая объектом jQuery.

Ответ 6

Нет разницы, вам просто нужно установить библиотеку jQuery и указать в своем проекте.