Я видел, как jQuery много просил в описаниях вакансий. Я также видел это, когда добавлял скрипты для использования начальной загрузки в проекте. И я также видел немного синтаксиса jQuery.

Синтаксис JQuery:

$ (document).ready(function( ){
 $(“#div2”).find(“*”).css({“color”:”red”, “border”:“5px solid red”});
});

Почему он продолжает появляться? Что оно делает? Когда его лучше всего использовать? Есть ли недостатки? Могу ли я обойтись без его использования? Как я могу узнать больше, если мне когда-нибудь понадобится его использовать?

Слоган на веб-сайте jQuery звучит так: Пиши меньше, делай больше. Как странно.

jQuery — это быстрая, небольшая и многофункциональная библиотека JavaScript. Он значительно упрощает такие вещи, как обход и манипулирование документами HTML, обработку событий, анимацию и Ajax, с помощью простого в использовании API, который работает во множестве браузеров. Благодаря сочетанию универсальности и расширяемости jQuery изменил способ написания JavaScript миллионами людей. — jQuery

Краткий обзор

Они показывают пару примеров обхода и манипулирования DOM, обработки событий и Ajax. Они кажутся мне в основном понятными.

Их пример обработки событий:

var hiddenBox = $( “#banner-message” );
$( “#button-container button” ).on( “click”, function( event ) {
 hiddenBox.show();
});

Дополнительная информация для контекста: Показать элемент #banner-message, который скрыт с помощью display:none в его CSS, при нажатии любой кнопки в #button-container.

Я собираюсь попытаться написать ванильную версию JavaScript вышеперечисленного, просто чтобы убедиться, что я все правильно понимаю.

function hiddenBox(“#banner-message”){
 (“#button-container button”).addEventListener(‘click’, (e) => e.preventDefault(show(“#banner-message”))
}

Хм… 🤔 Я все еще не на 100% уверен, что мой «перевод» точен, но, похоже, это основная суть всего этого. Я не полностью уверен в этом jQuery. Он не казался значительно проще или легче в использовании, чем обычный JavaScript. Опять же, в версии jQuery, вероятно, происходит что-то еще, чего я до сих пор не понимаю.

Выучить больше

К счастью, ковыряясь в документации по API, они упоминают Центр обучения jQuery для новичков, таких как я. Здесь они расскажут об основах, распространенных проблемах и практических рекомендациях в 10 главах. Поскольку это библиотека JavaScript, они рекомендуют, чтобы вы хорошо разбирались в JavaScript, прежде чем приступать к работе с jQuery.

Когда использовать jQuery

Пока я просматривал начальный сегмент «Как работает jQuery» в Учебном центре jQuery, я не нашел особого интереса, так как я рассмотрел еще один пример функции события «щелчка» и добавления/удаления имени класса HTML.

Затем был раздел о спецэффектах, и мой интерес пробудился. Я еще не слишком много изучал спецэффекты с помощью ванильного JavaScript. Библиотека jQuery поставляется с некоторыми методами/функциями (я не уверен, как они технически называются).



Эффекты | Документация по jQuery API
Библиотека jQuery предоставляет несколько методов добавления анимации на веб-страницу. К ним относятся простые, стандартные…api.jquery.com



В их примере ссылка медленно исчезает при нажатии. Не знаю, почему я хотел бы это сделать. Может, в «игровой» ситуации?

( “a” ).click(function( event ) {
 
 event.preventDefault();
 
 $( this ).hide( “slow” );
 
});

Примечание: (a) относится к ‹a href="http://jquery.com/»›jQuery‹/a›
Кажется, jQuery позволяет вам воздействовать непосредственно на элемент подобно CSS. селекторы.

Еще одно примечание: «.hide» — это функция/метод с параметром, установленным на «медленно».

Опять же, я не знаю, насколько легко (или слегка сложно) реализовать такие эффекты в ванильном JavaScript. Однако я слышал о некоторых анимациях с помощью CSS. Не знаю, как сделать так, чтобы ссылка исчезла. Может быть, со свойством display? В любом случае это, вероятно, потребует намного больше строк кода, чем просто использование .hide() в jQuery. Может быть.

В jQuery или не в jQuery

На своем пути к программированию я слышал слухи о том, что нам следует начать отказываться от jQuery. Тем не менее, я продолжаю видеть, насколько это популярно в некоторых компаниях и по сей день в их объявлениях о вакансиях. Если бы консенсус заключался в том, что мы можем отказаться от jQuery, я бы, вероятно, даже не задумывался об этом. Тем не менее, здесь я пишу этот блог, пытаясь понять это.

Flaviocopes объясняет, как jQuery стал популярным в начале-середине 2000-х для создания слайд-шоу изображений и виджетов. В то время браузеры не были стандартизированы, а jQuery был удобен для пользователя и помог решить эту проблему с браузером.

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

Они также подтвердили, что анимацию jQuery также можно выполнять с помощью CSS Transitions или CSS Animations.

По их мнению, jQuery «не следует больше использовать в новых проектах, предназначенных только для современных браузеров».

Ситуации, в которых jQuery следует (или можно) использовать:

  • если проект полагается на это
  • некоторые библиотеки зависят от jQuery (например, Bootstrap; но Bootstrap 5 предназначен для использования без jQuery *ах* )
  • некоторые шаблоны и плагины требуют этого
  • если по какой-то причине по-прежнему нужна поддержка старых браузеров
  • полезно для анимации, если вам не хватает навыков CSS

Есть так много статей и форумов, обсуждающих достоинства JavaScript по сравнению с jQuery. Вот недавний отчет от Real Tough Candy, опубликованный в июле 2021 года с заголовком, который прямо указывает на суть: Умер ли jQuery в 2021 году?. Они провели опрос среди 155 разработчиков и сделали несколько наблюдений.

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

Другое наблюдение заключалось в том, что большинство опрошенных разработчиков не используют jQuery для новых проектов. Хотя иногда, если исходная версия приложения использовала jQuery, может быть проще перестроить новое приложение с некоторым количеством jQuery.

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

Вывод

Думаю, я прочитал достаточно, чтобы сделать собственные выводы. Поскольку я уже немного изучил React.js и могу больше сосредоточиться на современных приложениях, я, вероятно, не смогу заморачиваться с jQuery. Особенно теперь, когда Bootstrap больше не полагается на него.

Может быть, мне следует просто сосредоточиться на улучшении CSS для анимации и старого доброго ванильного JavaScript.

Поскольку все еще существует довольно много компаний и приложений, использующих jQuery, я думаю, что просто изучу синтаксис и методы на лету, если до этого дойдет. В противном случае я просто буду двигаться вперед.