Содержание

Библиотека jQuery

346

Веб-программирование — Библиотека jQuery

Если вкратце охарактеризовать то, что делает библиотека jQuery, то это прозвучит довольно обыденно: данная библиотека позволяет изменять содержимое HTML-документов путем манипулирования объектами модели, создаваемой браузерами в процессе обработки HTML-кода (так называемые DOM-манипуляции).

Вам, наверное, уже приходилось манипулировать объектами DOM (Document Object Model — объектная модель документа) с помощью других библиотек JavaScript или встроенных функций API (Application Programming Interface — интерфейс программирования приложений), которые поддерживаются большинством современных браузеров. Однако библиотека jQuery работает намного лучше. Она превращает манипулирование объектами DOM в увлекательное занятие, временами напоминающее настоящее развлечение.

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

Что касается лично меня, то я использую jQuery в своих проектах по следующим причинам:

  • Средства jQuery необычайно выразительны. Эта библиотека позволяет добиться гораздо большего при намного меньшем объеме кода, чем в случае использования программных DOM-интерфейсов браузеров.

  • Методы jQuery применимы к целым группам элементов. Предлагаемый в DOM-модели стандартный подход, основанный на шаблонной цепочке действий «выбрать-повторить-изменить», больше не требуется. Следствием этого является уменьшение количества циклов for в коде, а значит, и снижение вероятности появления в нем ошибок.

  • Библиотека jQuery справляется с различиями в реализации DOM в различных браузерах (проблемы кросс-браузерности). Например, меня не должна беспокоить мысль об особенностях поддержки того или иного средства, чем печально славится браузер Internet Explorer (IE). Достаточно всего лишь сформулировать jQuery свои пожелания, и библиотека самостоятельно обеспечит совместимость с конкретным браузером.

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

Здесь также рассматриваются библиотека jQuery UI — это набор инструментальных средств, который предназначен для создания универсальных пользовательских интерфейсов и может применяться на любых устройствах.


  • 1. Основы jQuery, работа с DOM-моделью

    • Установка библиотеки jQuery
    • Работа с DOM-объектами
    • Работа с выбранными элементами
    • Навигация по дереву DOM
    • Создание новых элементов
    • Вставка дочерних, сестринских и родительских элементов
    • Замена и удаление элементов
    • Атрибуты и свойства
    • Классы
    • Работа с CSS
    • Содержимое элементов
    • Элементы формы
    • Связывание данных с элементами
  • 2.

    Обработка событий, эффекты и анимация
    • Обработка событий
    • Использование прямых методов событий
    • Базовые эффекты
    • Пользовательские эффекты
    • Очередь эффектов
  • 3. Работа с данными и Ajax

    • Шаблоны данных
    • Обработка форм
    • Валидация форм
    • jQuery и Ajax
    • Использование Ajax
  • 4. Библиотека jQuery UI

    • Установка библиотеки jQuery UI
    • Виджет Button
    • Виджет Progress Bar
    • Виджет Slider
    • Виджет Autocomplete
    • Виджет Accordion
    • Виджет Tabs
    • Виджет Datepicker
    • Виджет Dialog
    • Эффекты jQuery UI
    • CSS-фреймворк jQuery UI
    • Перетаскивание элементов (взаимодействия Draggable и Droppable)
    • Сортировка элементов (взаимодействие Sortable)
    • Выборка элементов (взаимодействие Selectable)
    • Масштабирование элементов (взаимодействие Resizable)
    • Использование библиотеки jQuery UI на практике

Отличия JavaScript и jQuery | IT-INCUBATOR

JavaScript и jQuery являются мощными инструментами в веб-разработке. Их основная задача — сделать страницы более динамичными и интерактивными. Или, проще говоря — сделать их более “живыми”.

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

JavaScript

JavaScript (JS) — это язык программирования, созданный в 1995 году Брэнданом Эйхом. С его помощью достигается максимальная производительность HTML-страниц. JavaScript позволяет добавлять в них динамику, наполнять анимацией и всевозможными интерактивными элементами.

Наряду с HTML и CSS, JavaScript является одной из трёх основных технологий, используемых в создании веб-сайтов и приложений.

В то время как HTML и CSS определяют структуру и внешний вид веб-страниц, JavaScript добавляет в них динамические визуальные эффекты. Например, используя JS мы можем написать код события при клике мышкой, наведении курсора в определённую область страницы и многих других действиях.

JavaScript — это основной клиентский язык программирования. Все веб-браузеры имеют встроенный движок, который распознаёт и обрабатывает код JS.

Кроме разработки веб-сайтов, JavaScript также используется во многих десктопных и серверных программах (например, платформа Node.js), и в некоторых базах данных (например, CouchDB и MongoDB).

Основным преимуществом использования JS в веб-разработке является мгновенная реакция. С его помощью веб-страницы могут незамедлительно ответить на какое-либо действие — например, когда посетитель заполняет форму, водит курсором по экрану или заполняет форму.

jQuery

jQuery — это популярная библиотека JavaScript, выпущенная в 2006 году. Она бесплатна, имеет открытый исходный код с лицензией MIT и превосходную кроссбраузерную совместимость.

Пожалуй, девиз jQuery можно описать так: “Делай больше, пиши меньше”. С помощью всего одной строки кода библиотека jQuery позволяет достичь того же результата, что и несравнимо большее кол-во строк, написанных на чистом JavaScript.

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

Основные отличия JavaScript и jQuery



JavaScript(JS)

jQuery

Язык программирования, используемый для улучшения интерактивности в веб-браузерах

Библиотека JavaScript

Часто, для достижения определенного результата, требуется написать большое количество кода

Позволяет писать меньше кода, достигая аналогичного результата

Разработчикам необходимо написать собственный скрипт, который требует много времени

В библиотеке существуют уже готовые сценарии, которыми разработчик может пользоваться

JavaScript может существовать без jQuery

jQuery не может существовать без JavaScript

Использует JIT-компиляцию

Использует DOM

Для достижения кроссбраузерной совместимости необходимо написать дополнительный код (или изменять уже имеющийся)

jQuery уже имеет встроенную кроссбраузерную функциональность

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

jQuery также быстро обрабатывается современными браузерами и компьютерами, но библиотека сначала конвертируется в JavaScript и затем обрабатывается браузером

Для создания анимации с использованием JavaScript требуется много строк кода. В основном это достигается изменением стилей HTML-страницы

jQuery позволяет добавлять эффекты анимации гораздо быстрее, используя меньшее количество кода

Подведём итог: jQuery является библиотекой JavaScript, которая позволяет значительно упрощать использование JS в процессе создания веб-приложений. Используя jQuery, для выполнения одной и той же задачи разработчик может использовать всего одну строку кода вместо десятков строк в сравнении с чистым JavaScript.

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

Разница между JavaScript и jQuery

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

В интернете тысячи сайтов. Каждый день создаются новые сайты. Каждая бизнес-организация поддерживает веб-сайт для достижения своих клиентов. Для разработки веб-приложений используются различные технологии. Два из них — это JavaScript и jQuery. JavaScript — это интерпретируемый язык программирования высокого уровня. Это одна из основных технологий для веб-разработки с использованием HTML и CSS. JavaScript используется для добавления интерактивности на веб-страницу. jQuery — это библиотека, написанная на JavaScript. jQuery быстрый и расширяемый и предоставляет больше возможностей, чем JavaScript. jQuery помогает программистам решать задачи в пределах минимального количества строк, чем JavaScript. Это упрощает процесс создания высокочувствительных веб-страниц.

Содержание
  1. Обзор и основные отличия
  2. Что такое JavaScript
  3. Что такое jQuery
  4. Сходство между JavaScript и jQuery
  5. В чем разница между JavaScript и jQuery
  6. Заключение
Что такое JavaScript?

JavaScript — это легкий язык программирования, используемый для создания динамических веб-страниц. Он с открытым исходным кодом, а так же он кросс-платформенный. JavaScript — многопарадигмальный язык программирования, поддерживающий объектно-ориентированное программирование. Он считается одним из трех основных языков веб, кроме HTML и CSS. HTML расшифровывается как «Язык гипертекстовой разметки» (Hyper Text Markup Language). Он используется для построения структуры веб-страницы. CSS расшифровывается как «Каскадные таблицы стилей» (Cascading Style Sheets). JavaScript — это язык программирования для добавления интерактивности на веб-страницу.  Это клиентский язык. В отличие от PHP, ASP.NET, который выполняет свой код на веб-сервере, JavaScript выполняется на стороне клиента.

.

JavaScript также используется для проверки полей формы веб-страницы. Например, чтобы проверить, правильно ли клиент ввел адрес электронной почты или нет. JavaScript помогает мгновенно получать отзывы посетителей. Он также может обрабатывать нажатия кнопок и навигации. Этот язык делает веб-страницу более интерактивной. Например, когда клиент наводит указатель мыши на веб-сайт, он реагирует и изменяется. Одним из основных преимуществ JavaScript является возможность создавать богатые интерфейсы. Разработка программ на JavaScript довольно проста и понятна. Нет необходимости использовать дорогие средства разработки. Программисты могут писать код JavaScript с помощью текстового редактора, такого как блокнот. С помощью веб-браузера программы на JavaScript могут быть выполнены.

У JavaScript также есть некоторые недостатки. Поскольку это язык сценариев, он не такой быстрый, как языки на основе компилятора, такие как C или C ++.  Он также не поддерживает многопоточность или многопроцессорность. Он не может использоваться для выполнения файловых операций и не может напрямую обращаться к базе данных. Но, в целом, это один из самых популярных языков для веб-разработки.

Что такое jQuery?

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

Он, также кроссплатформенный и работает в современных веб-браузерах, таких как Internet Explorer, Safari, Chrome, Firefox и Opera. Он может абстрагироваться от специфичных для браузера функций. Поэтому разработчикам легко сосредоточиться на дизайне. jQuery обеспечивает возможности затухания изображения, анимации и событий.

jQuery основан на объектной модели документов (DOM). Это древовидная структура, которая представляет все элементы веб-страницы.  jQuery упрощает поиск, выбор и управление элементами DOM. Его можно использовать для выполнения тех же задач, которые выполняет JavaScript. Но используя jQuery, большинство из них может быть выполнено с меньшим количеством кода, чем JavaScript. Его можно использовать как альтернативу JavaScript, потому что он быстрый и расширяемый. Есть много сторонних библиотек, доступных для выполнения специализированных задач, или разработчик может писать свои собственные программы, используя плагины jQuery.

Сегодня такие компании, как Google, IBM, Microsoft используют jQuery в качестве одной из своих веб-технологий. В целом, jQuery предоставляет несколько преимуществ, таких как управление HTML, CSS и DOM. Разбор JSON и многое другое при упрощении современного процесса веб-разработки проще.

Сходство между JavaScript и jQuery?
  • И JavaScript и jQuery используются для создания динамических веб-страниц.
  • JavaScript и jQuery являются открытыми и кроссплатформенными.
  • Оба поддерживают объектно-ориентированное программирование.
  • JavaScript и jQuery могут быть использованы для проверки веб-страниц.
  • Оба могут быть использованы для создания событий.
  • И JavaScript, и jQuery поддерживаются многими веб-браузерами.
В чем разница между JavaScript и jQuery?

 

JavaScript против jQuery
JavaScript — это интерпретируемый язык программирования высокого уровняjQuery — это кроссплатформенная библиотека JavaScript, предназначенная для упрощения клиентских сценариев HTML
Из чего состоит
JavaScript является комбинацией скрипта ECMA и объектной модели документаJQuery состоит из объектной модели документа
Разработчик
JavaScript был разработан: Netscape Communications Corporation, Mozilla Foundation и ECMA InternationaljQuery разработан командой jQuery
Простота
JavaScript сложнее, чем JQuery.  Требуется несколько строк для выполнения задачиJQuery проще, чем JavaScript. Требуется меньшее количество строк для выполнения задачи

 

Заключение — JavaScript против jQuery

JavaScript и jQuery — широко используемые веб-технологии для создания динамических и интерактивных веб-страниц. JavaScript может быть встроен в HTML-страницы, чтобы сделать веб-страницы интерактивными и выполнять различные задачи проверки. jQuery можно использовать как альтернативу JavaScript. Это библиотека JavaScript.

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

JQuery — Видеоуроки, курсы, туториалы

JQuery — Видеоуроки, курсы, туториалы | CourseHunter

📌 Очень жаль, что всем известный персонаж решил начать войну. Мы молимся за Украину и за мир!

💬 C Днем программиста! 13-16 Сентября -50% 🙌 🙌 на все пакеты CH. Спасибо что с нами! 🤜 🤛

JQuery

JQuery — один из самых популярных JavaScript фреймворков. Его легкость и быстрота в освоении завоевали сердца и умы веб-разработчиков. Первый релиз фреймворка вышел в 2006 году, и до сегодня он пользуется большой популярностью, в виду своего простого синтаксиса и кучей бесплатных но мощных плагинов.

JQuery в топиках

Frontend

ASC DESC

Курсы по jquery

Создание адаптивного веб-сайта с использованием HTML5, CSS3, JS и Bootstrap

Build Responsive Website Using HTML5, CSS3, JS And Bootstrap

Изучите HTML5, CSS3, JavaScript, jQuery и Bootstrap, создав современный адаптивный веб-сайт.

Бесплатно

Посмотреть

Курс JavaScript / jQuery

Курс JavaScript / jQuery

В видеокурсе Вы изучите основы языка JavaScript для создания интерактивности для Ваших веб-сайтов, освоите работу с популярной библиотекой jQuery и примените полученные знания на практике. Для прохождения данного курса потребуются знания из курсов-модулей Html и css, Php и mysql. Изучите онлайн уроки программирования на JavaScript и jQuery с нуля и сделайте Ваши сайты красивыми и интересными!

Премиум

Посмотреть

Bootcamp: Full-Stack веб-разработчик с реальными проектами

Full-Stack Web Developer Bootcamp with Real Projects

Этот курс охватывает весь процесс веб-разработки с нуля до развертывания с использованием доменного имени.

Мы будем использовать Node, Express, MongoDB для создания серверной части, которая является Back-End, и мы будем использовать HTML, CSS, Bootstrap, JavaScript и jQuery для создания клиентской стороны, которая является Front-End. Опыт программирования не требуется.

Премиум

Посмотреть

JAVASCRIPT + ANGULAR 8 + JQUERY + REACT + NODE + TYPESCRIPT

JAVASCRIPT + ANGULAR 8 + JQUERY + REACT + NODE + TYPESCRIPT

Вы станете гуру веб-программирования.

Премиум

Посмотреть

Курс по jQuery. Основы

Курс по jQuery. Основы

JQuery — универсальная библиотека JavaScript, которая намного упрощает работу с HTML страницей и ее элементами. Писать скрипты на JQuery легко и быстро, и самое главное — кроссбраузерно. В этом курсе мы начнем с основ JQuery, делая разные манипуляции с элементами страницы, и завершим курс научившись делать асинхронные запросы (Ajax).

Бесплатно

Посмотреть

Создание расширяемых панелей с помощью jQuery

Creating Expandable Panels with jQuery

Научитесь создавать контент, который можно развернуть одним щелчком мыши. Этот метод очень популярен для предоставления дополнительной информации по запросу, например, часто задаваемых вопросов, биографий или дополнительной информации о продукте.
В этом курсе Chris Converse показывает, как создать код HTML, CSS и jQuery, необходимый для расширяемой панели контента, которая скрывает и отображает содержимое по запросу пользователя.
. ..

Премиум

Посмотреть

Практические примеры jQuery

Hands-On jQuery: jQuery Examples

Курс «Hands-On jQuery: jQuery Examples» включает в себя ряд уникальных и полезных примеров кода различной сложности, которые иллюстрируют концепции библиотеке jQuery.
У вас есть возможность попрактиковаться в jQuery, что поможет вам стать действительно уверенным разработчиком и улучшит ваши знания самой популярной библиотеки JavaScript.

Премиум

Посмотреть

Основы jQuery и чистый DOM Scripting

Advanced JS Fundamentals to jQuery & Pure DOM Scripting

Получить углубленное понимание сложных концепций JavaScript, новой ключевой команды \»this\», наследования, типы компараторов и другие. Узнайте, что происходит в памяти при испрользовании различных указателей.
Потом вы узнаете, что находится под капотом популярной библиотеки Jquery, создавая свою собственную версию библиотеки на ванильном JavaScript и DOM API.

Удален по просьбе правообладателя

Посмотреть

jQuery Plugins and jQuery UI

jQuery Plugins and jQuery UI

Скотт Гонсалес, ведущий разработчик JQuery UI, ныряет в шаблоны и практики написания JQuery плагинов. Скотт охватывает многие из плагинов JQuery UI, указывая на сильные и слабые стороны какие он видит в различных плагинах. Этот курс не самый свежий, он 2012 года, но учитывая то, что еще много разработчиков используют jquery, он все еще остается актуальным даже сегодня.

Удален по просьбе правообладателя

Посмотреть

Скачать jQuery | jQuery

Доступны сжатые и несжатые копии файлов jQuery. Несжатый файл лучше всего использовать во время разработки или отладки; сжатый файл экономит полосу пропускания и повышает производительность в производстве. Вы также можете загрузить файл исходной карты для использования при отладке со сжатым файлом. Файл карты , а не , требуется пользователям для запуска jQuery, он просто улучшает работу отладчика разработчика. Начиная с jQuery 1.11.0/2.1.0, //# sourceMappingURL 9Комментарий 0006 не включается в сжатый файл.

Чтобы локально загрузить эти файлы, щелкните ссылку правой кнопкой мыши и выберите в меню "Сохранить как. ..".

ссылка jQuery

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

Загрузить сжатый рабочий jQuery 3.6.1

Загрузить несжатый рабочий jQuery 3.6.1

Загрузить файл карты для jQuery 3.6.1

Вы также можете использовать тонкую сборку, в которую не входят модули ajax и эффекты:

Загрузить сжатую рабочую версию jQuery 3.6.1 Slim build

Загрузить несжатую рабочую версию jQuery 3.6.1 Slim build

Загрузить файл карты для тонкой сборки jQuery 3.6.1

Запись в блоге jQuery 3.6.1 с примечаниями к выпуску

jQuery зарегистрирован как пакет в npm. Вы можете установить последнюю версию jQuery с помощью команды npm CLI:

1

 

нпм установить jquery

В качестве альтернативы вы можете использовать команду интерфейса командной строки Yarn:

1

 

пряжа добавить jquery

Это установит jQuery в node_modules 9каталог 0006. В node_modules/jquery/dist/ вы найдете несжатый выпуск, сжатый выпуск и файл карты.

jQuery также зарегистрирован как пакет в Bower. Вы можете установить последнюю версию jQuery с помощью команды:

1

 

беседка установить jquery

Это установит jQuery в каталог установки Bower, по умолчанию Bower_components . В bower_components/jquery/dist/ вы найдете несжатый выпуск, сжатый выпуск и файл карты.

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

1

 

установка беседки https://code. jquery.com/jquery-3.6.1.min.js

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

Существует две версии Migrate. Первый поможет вам обновить код jQuery до 1.9 до jQuery 1.9 до 3.0. Вы можете получить эту версию здесь:

Загрузите сжатую производственную версию jQuery Migrate 1.4.1

Загрузите несжатую рабочую версию jQuery Migrate 1.4.1

Вторая версия помогает вам обновить код для работы с jQuery 3.0 или выше, после того, как вы использовали Migrate 1. x и обновились до jQuery 1.9 или выше :

Загрузить сжатую производственную версию jQuery Migrate 3.4.0

Загрузить несжатый, разработка jQuery Migrate 3.4.0

Обязательно протестируйте веб-страницы, использующие jQuery, во всех браузерах, которые вы хотите поддерживать. Сайт Microsoft Developer Resources предоставляет виртуальные машины для тестирования многих версий Internet Explorer.

Команда jQuery постоянно работает над улучшением кода. Каждая фиксация в репозитории Github создает незавершенную версию кода, которую мы обновляем в CDN jQuery. Иногда эти версии нестабильны и никогда не подходят для производственных площадок. Мы рекомендуем использовать их, чтобы определить, была ли уже исправлена ​​ошибка, при сообщении об ошибках в выпущенных версиях или чтобы увидеть, были ли добавлены новые ошибки.

Загрузить незавершенную сборку jQuery

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

ссылка CDN jQuery, предоставленная StackPath

CDN jQuery поддерживает целостность подресурсов (SRI), что позволяет браузеру проверять, что доставляемые файлы не были изменены. Эта спецификация в настоящее время реализуется браузерами. Добавление нового атрибута целостности гарантирует, что ваше приложение получит это улучшение безопасности, поскольку браузеры его поддерживают.

Чтобы использовать jQuery CDN, просто укажите ссылку на файл в теге script непосредственно из домена jQuery CDN. Вы можете получить полный тег сценария, включая атрибут целостности подресурса, посетив https://code.jquery.com и щелкнув версию файла, которую вы хотите использовать. Скопируйте и вставьте этот тег в свой HTML-файл.

Начиная с jQuery 1.9 файлы исходной карты доступны в сети CDN jQuery. Однако начиная с версии 1.10.0/2. 1.0 сжатый jQuery больше не включает комментарий исходной карты в копии CDN, поскольку для этого требуется, чтобы несжатый файл и файл исходной карты размещались в том же месте, что и сжатый файл. Если вы поддерживаете локальные копии и можете контролировать расположение всех трех файлов, вы можете добавить комментарий исходной карты к сжатому файлу для упрощения отладки.

Чтобы просмотреть все доступные файлы и версии, посетите https://code.jquery.com. Начиная с jQuery 1.9 они также могут размещать файлы исходной карты; проверьте документацию сайта.

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

  • Google CDN
  • CDN Майкрософт
  • CDNJS CDN
  • jsDelivr CDN

jQuery предоставляется по лицензии MIT.

Код размещен и разработан в репозитории jQuery GitHub. Если вы заметили некоторые области кода, которые можно улучшить, не стесняйтесь обсуждать их на форуме Developing jQuery Core. Если вы хотите принять участие в разработке jQuery, посетите наш сайт для участников для получения дополнительной информации.

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

ссылка Сборка из Git

Примечание: Чтобы просто использовать последнюю незавершенную версию jQuery, попробуйте предварительную сборку jQuery, описанную выше.

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

Если у вас есть доступ к Git, вы можете подключиться к репозиторию здесь:

1

 

клон git git://github.com/jquery/jquery.git

Вы также можете проверить и собрать определенную версию jQuery из GitHub:

1

2

 

git clone git://github.com/jquery/jquery.git

git checkout 1.2.6

Файл README для конкретной версии будет содержать инструкции по сборке этой версии, так как процесс со временем менялся.


Все прошлые выпуски можно найти на jQuery CDN.

JavaScript, jQuery и JSON | Coursera

Об этом курсе

34 861 недавних просмотров

В этом курсе мы рассмотрим язык JavaScript и то, как он поддерживает шаблон объектно-ориентированного программирования, уделяя особое внимание уникальному аспекту подходов JavaScript к объектно-ориентированному программирования. Мы рассмотрим краткое введение в библиотеку jQuery, которая широко используется для выполнения в браузере манипуляций с объектной моделью документа (DOM) и обработки событий. Вы также узнаете больше о нотации объектов JavaScript (JSON), которая обычно используется в качестве синтаксиса для обмена данными между кодом, работающим на сервере (например, в PHP), и кодом, работающим в браузере (JavaScript/jQuery).

Гибкие сроки

Гибкие сроки

Сброс сроков в соответствии с вашим графиком.

Совместно используемый сертификат

Совместно используемый сертификат

Получите сертификат по завершении

100% онлайн

100% онлайн

Начните немедленно и учитесь по собственному графику.

Специализация

Курс 4 из 4 в

Специализация «Веб-приложения для всех»

Средний уровень

Средний уровень

Часов на выполнение

Прибл. 26 часов

Доступные языки

Английский

Субтитры: арабский, французский, португальский (европейский), итальянский, вьетнамский, немецкий, русский, английский, испанский

Приобретаемые навыки

  • Препроцессор гипертекста (PHP)
  • Jquery
  • JavaScript
Гибкие сроки

Гибкие сроки

Сбросить сроки в соответствии с вашим расписанием.

Совместно используемый сертификат

Совместно используемый сертификат

Получите сертификат по завершении

100% онлайн

100% онлайн

Начните немедленно и учитесь по собственному графику.

Специализация

Курс 4 из 4 в специализации

Веб-приложения для всех

Средний уровень

Средний уровень

Часов для прохождения

Прибл. 26 часов на прохождение

Доступные языки

English

Subtitles: Arabic, French, Portuguese (European), Italian, Vietnamese, German, Russian, English, Spanish

Instructor

Charles Russell Severance

Clinical Professor

School of Information

3,539,040 Учащиеся

47 Курсы

Предлагает

Мичиганский университет

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

Reviews

4.6

Filled StarFilled StarFilled StarFilled StarHalf Filled Star

160 reviews

  • 5 stars

    78.37%

  • 4 stars

    13.89%

  • 3 stars

    2.35%

  • StarFill StarFill StarFill StarFill StarFill StarFill StarFill StarFill StarFill StarFill 2 звезды

    2 звезды

    1 звезда заполнены0002 от ABApr 26, 2019

    Отличный курс для всех, кто заинтересован в создании прочной основы для веб-разработки. Быстро развивающийся, но всеобъемлющий и твердый в основах.

    Заполненная звездаЗаполненная звездаЗаполненная звездаЗаполненная звездаЗаполненная звезда

    by CC1 июня 2021 г.

    Замечательный курс. Я действительно научился запрашивать json из jquery и отображать на веб-странице. но задание в основном было сосредоточено на запросе данных из различных таблиц, таких как многие ко многим и все.

    Заполненная звездаЗаполненная звездаЗаполненная звездаЗаполненная звездаЗаполненная звезда

    by DKNov 24, 2018

    Очень полезно для реальных приложений. by MHJun 18, 2020

    Очень сложный, необходимо пройти предыдущие курсы по специализации, чтобы получить максимальную отдачу от этого

    Просмотреть все отзывы

    О специализации «Веб-приложения для всех»

    Эта специализация представляет собой введение в создание веб-приложений для всех, кто уже имеет базовое представление об адаптивном веб-дизайне с использованием JavaScript, HTML и CSS. Веб-приложения для всех — это введение в разработку веб-приложений. Вы будете разрабатывать веб-приложения и приложения баз данных на PHP, используя SQL для создания базы данных, а также функциональные возможности JavaScript, jQuery и JSON.

    Часто задаваемые вопросы

    • Когда я получу доступ к лекциям и заданиям?

    • Что я получу, если подпишусь на эту специализацию?

    • Доступна ли финансовая помощь?

    • Есть проект?

    Есть вопросы? Посетите Справочный центр для учащихся.

    JavaScript · Bootstrap v5.2

    Индивидуальные или скомпилированные

    Плагины могут быть включены по отдельности (с использованием отдельных js/dist/*. js ), или все сразу, используя bootstrap.js или уменьшенный bootstrap.min.js (не включайте оба).

    Если вы используете сборщик (Webpack, Parcel, Vite…), вы можете использовать файлы /js/dist/*.js , которые готовы к UMD.

    Использование с фреймворками JavaScript

    Хотя Bootstrap CSS можно использовать с любым фреймворком, Bootstrap JavaScript не полностью совместим с такими фреймворками JavaScript, как React, Vue и Angular , которые предполагают полное знание DOM. И Bootstrap, и фреймворк могут попытаться видоизменить один и тот же элемент DOM, что приведет к таким ошибкам, как выпадающие списки, которые застревают в «открытом» положении.

    Лучшей альтернативой для тех, кто использует этот тип фреймворков, является использование пакета для конкретного фреймворка вместо Bootstrap JavaScript. Вот некоторые из самых популярных вариантов:

    • React: React Bootstrap
    • Vue: BootstrapVue (в настоящее время поддерживает только Vue 2 и Bootstrap 4)
    • Угловой: ng-бутстрап

    Использование Bootstrap в качестве модуля

    Попробуйте сами! Загрузите исходный код и рабочую демонстрацию для использования Bootstrap в качестве модуля ES из репозитория twbs/examples. Вы также можете открыть пример в StackBlitz.

    Мы предоставляем версию Bootstrap, созданную как ESM ( bootstrap.esm.js и bootstrap.esm.min.js ), которая позволяет вам использовать Bootstrap в качестве модуля в браузере, если ваши целевые браузеры поддерживают Это.

     <тип сценария = "модуль">
      импортировать {Toast} из 'bootstrap.esm.min.js'
      Array.from(document.querySelectorAll('.toast'))
        .forEach(toastNode => новый Toast(toastNode))
    
     

    По сравнению с сборщиками JS, использование ESM в браузере требует использования полного пути и имени файла вместо имени модуля. Подробнее о модулях JS в браузере. Вот почему мы используем 'bootstrap.esm.min.js' вместо 'bootstrap' выше. Однако это еще больше усложняется нашей зависимостью Popper, которая импортирует Popper в наш JavaScript следующим образом:

     import * as Popper from "@popperjs/core"
     

    Если вы попробуете это как есть, вы увидите в консоли следующую ошибку:

     Uncaught TypeError: Не удалось разрешить спецификатор модуля "@popperjs/core".  Относительные ссылки должны начинаться с «/», «./» или «../».
     

    Чтобы исправить это, вы можете использовать importmap для преобразования произвольных имен модулей в полные пути. Если ваши целевые браузеры не поддерживают importmap , вам нужно будет использовать проект es-module-shims. Вот как это работает для Bootstrap и Popper:

     
    
      <голова>
        <мета-кодировка="utf-8">
        
        
        Здравствуй, модульность!
      
      <тело>
         

    Здравствуй, модульность!

    <тип сценария="импорткарта"> { "импорт": { "@popperjs/core": "https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js", "бутстрап": "https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.esm.min.js" } } <тип сценария="модуль"> импортировать * как бутстрап из 'bootstrap' новый bootstrap.Popover(document.getElementById('popoverButton'))

    Зависимости

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

    Наши раскрывающиеся списки, всплывающие окна и всплывающие подсказки также зависят от Popper.

    Атрибуты данных

    Почти все подключаемые модули Bootstrap можно активировать и настроить только через HTML с атрибутами данных (наш предпочтительный способ использования функций JavaScript). Убедитесь, что использует только один набор атрибутов данных для одного элемента (например, вы не можете вызвать всплывающую подсказку и модальное окно с помощью одной и той же кнопки.)

    Поскольку параметры могут передаваться через атрибуты данных или JavaScript, вы можете добавить имя параметра к data-bs-, как в data-bs -анимация="{значение}" . Обязательно измените тип регистра имени параметра с « camelCase » на « kebab-case » при передаче параметров через атрибуты данных. Например, используйте data-bs-custom-class="beautifier" вместо data-bs-customClass="beautifier" 9.0006 .

    Начиная с Bootstrap 5.2.0, все компоненты поддерживают экспериментальный зарезервированный атрибут данных data-bs-config , который может содержать простую конфигурацию компонента в виде строки JSON. Когда элемент имеет атрибуты data-bs-config='{"delay":0, "title":123}' и data-bs-title="456" , окончательное значение title будет 456 , и отдельные атрибуты данных переопределяют значения, указанные в data-bs-config . Кроме того, существующие атрибуты данных могут содержать такие значения JSON, как 9.0005 data-bs-delay='{"показать":0,"скрыть":150}' .

    Селекторы

    Мы используем родные методы querySelector и querySelectorAll для запроса элементов DOM из соображений производительности, поэтому вы должны использовать допустимые селекторы. Если вы используете специальные селекторы, такие как roll:Example , обязательно избегайте их.

    Events

    Bootstrap предоставляет настраиваемые события для уникальных действий большинства плагинов. Как правило, они бывают в форме инфинитива и причастия прошедшего времени, где инфинитив (например, показать ) запускается в начале события, а его форма причастия прошедшего времени (например, показано ) запускается при завершении действия.

    Все инфинитивные события обеспечивают функциональность preventDefault() . Это дает возможность остановить выполнение действия до его начала. Возврат false из обработчика событий также автоматически вызовет preventDefault() .

     const myModal = document.querySelector('#myModal')
    myModal.addEventListener('show.bs.modal', событие => {
      если (!данные) {
        return event.preventDefault() // останавливает показ модального окна
      }
    })
     

    Programmatic API

    Все конструкторы принимают необязательный объект опций или ничего (что запускает подключаемый модуль с его поведением по умолчанию):

     const myModalEl = document.querySelector('#myModal')
    const modal = new bootstrap.Modal(myModalEl) // инициализируется значениями по умолчанию
    const configObject = {клавиатура: ложь}
    const modal1 = new bootstrap.Modal(myModalEl, configObject) // инициализируется без клавиатуры
     

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

     bootstrap. Popover.getInstance(myPopoverEl)
     

    Этот метод вернет null , если экземпляр не инициирован для запрошенного элемента.

    Кроме того, getOrCreateInstance можно использовать для получения экземпляра, связанного с элементом DOM, или для создания нового, если он не был инициализирован.

     bootstrap.Popover.getOrCreateInstance(myPopoverEl, configObject)
     

    Если экземпляр не был инициализирован, он может принять и использовать необязательный объект конфигурации в качестве второго аргумента.

    Селекторы CSS в конструкторах

    В дополнение к методам getInstance и getOrCreateInstance все конструкторы подключаемых модулей могут принимать элемент DOM или допустимый селектор CSS в качестве первого аргумента. Элементы подключаемых модулей находятся с помощью метода querySelector , поскольку наши подключаемые модули поддерживают только один элемент.

     const modal = новый bootstrap. Modal('#myModal')
    const dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
    const offcanvas = bootstrap.Offcanvas.getInstance('#myOffcanvas')
    const alert = bootstrap.Alert.getOrCreateInstance('#myAlert')
     

    Асинхронные функции и переходы

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

     const myCollapseEl = document.querySelector('#myCollapse')
    myCollapseEl.addEventListener('показанный.bs.collapse', событие => {
      // Действие, выполняемое после расширения сворачиваемой области
    })
     

    Кроме того, вызов метода переходного компонента будет игнорироваться .

     const myCarouselEl = document.querySelector('#myCarousel')
    const carousel = bootstrap.Carousel.getInstance(myCarouselEl) // Получить экземпляр карусели
    myCarouselEl. addEventListener('slid.bs.carousel', событие => {
      carousel.to('2') // Перейдет к слайду 2, как только завершится переход к слайду 1
    })
    carousel.to('1') // Начнет переход к слайду 1 и вернется к вызывающей стороне
    carousel.to('2') // !! Будет проигнорирован, т.к. переход на слайд 1 не закончен!!
     
    метод dispose

    Хотя может показаться правильным использовать метод dispose сразу после hide() , это приведет к неверным результатам. Вот пример использования проблемы:

     const myModal = document.querySelector('#myModal')
    myModal.hide() // это асинхронно
    myModal.addEventListener('показанный.bs.hidden', событие => {
      myModal.dispose()
    })
     

    Настройки по умолчанию

    Вы можете изменить настройки по умолчанию для подключаемого модуля, изменив его Constructor.Default object:

     // изменяет значение по умолчанию для параметра «клавиатура» модального плагина на false
    bootstrap. Modal.Default.keyboard = ложь
     

    Методы и свойства

    Каждый подключаемый модуль Bootstrap предоставляет следующие методы и статические свойства.

    Метод Описание
    утилизировать Уничтожает модальное окно элемента. (Удаляет сохраненные данные в элементе DOM)
    getInstance Статический метод , позволяющий получить модальный экземпляр, связанный с элементом DOM.
    getOrCreateInstance Статический метод , позволяющий получить модальный экземпляр, связанный с элементом DOM, или создать новый, если он не был инициализирован.
    Статическое имущество Описание
    ИМЯ Возвращает имя плагина. (Пример: bootstrap.Tooltip.NAME )
    ВЕРСИЯ Доступ к версии каждого плагина Bootstrap можно получить через свойство VERSION конструктора плагина (пример: bootstrap. Tooltip.VERSION )

    Дезинфицирующее средство

    Всплывающие подсказки и всплывающие окна используют наше встроенное дезинфицирующее средство для очистки параметров, которые принимают HTML. 9ария-[\w-]*$/i константа DefaultAllowlist = { // Глобальные атрибуты разрешены для любого предоставленного ниже элемента. '*': ['класс', 'каталог', 'идентификатор', 'язык', 'роль', ARIA_ATTRIBUTE_PATTERN], a: ['цель', 'href', 'название', 'отн'], область: [], б: [], бр: [], столбец: [], код: [], раздел: [], эм: [], час: [], ч2: [], h3: [], h4: [], h5: [], h5: [], h6: [], я: [], img: ['src', 'srcset', 'alt', 'название', 'ширина', 'высота'], ли: [], ол: [], п: [], пре: [], с: [], маленький: [], охватывать: [], суб: [], Как дела: [], сильный: [], ты: [], ул: [] } 9данные-мое-приложение-[\w-]+/ myDefaultAllowList['*'].push(myCustomRegex)

    Если вы хотите обойти наше дезинфицирующее средство, потому что предпочитаете использовать специальную библиотеку, например DOMPurify, вам следует сделать следующее:

     const yourTooltipEl = document. querySelector('#yourTooltip')
    const tooltip = new bootstrap.Tooltip(yourTooltipEl, {
      дезинфицироватьFn(содержимое) {
        вернуть DOMPurify.sanitize (контент)
      }
    })
     

    Возможно использование jQuery

    Вам не нужен jQuery в Bootstrap 5 , но все же можно использовать наши компоненты с jQuery. Если Bootstrap обнаружит jQuery в объекте window , он добавит все наши компоненты в систему плагинов jQuery. Это позволяет вам делать следующее:

     $('[data-bs-toggle="tooltip"]').tooltip() // для включения всплывающих подсказок с конфигурацией по умолчанию
    $('[data-bs-toggle="tooltip"]').tooltip({ border: 'clippingParents', customClass: 'myClass' }) // для инициализации всплывающих подсказок с заданной конфигурацией
    $('#myTooltip').tooltip('show') // для запуска метода `show`
     

    То же самое касается и других наших компонентов.

    Нет конфликта

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

     const bootstrapButton = $.fn.button.noConflict() // вернуть $.fn.button ранее присвоенное значение
    $.fn.bootstrapBtn = bootstrapButton // дать $().bootstrapBtn функциональность Bootstrap
     

    Bootstrap официально не поддерживает сторонние библиотеки JavaScript, такие как Prototype или jQuery UI. Несмотря на .noConflict и события, связанные с пространством имен, могут возникнуть проблемы совместимости, которые необходимо устранить самостоятельно.

    События jQuery

    Bootstrap обнаружит jQuery, если jQuery присутствует в объекте window и нет атрибута data-bs-no-jquery , установленного для . Если jQuery найден, Bootstrap будет генерировать события благодаря системе событий jQuery. Поэтому, если вы хотите прослушивать события Bootstrap, вам придется использовать методы jQuery (9).0005 .на , .один ) вместо addEventListener .

     $('#myTab a').on('show.bs.tab', () => {
      // сделай что-нибудь...
    })
     

    Отключен JavaScript

    Плагины Bootstrap не имеют специального запасного варианта, когда JavaScript отключен. Если вас волнует пользовательский опыт в этом случае, используйте

    Следует ли вам использовать или изучать jQuery в 2020 году?

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

    Несколько лет назад она была намного популярнее, и теперь некоторые потребности jQuery были вытеснены современными браузерами (к счастью!), но эта библиотека JavaScript по-прежнему используется людьми.

    Почему jQuery вообще стал таким популярным? Во-первых, jQuery родился в мире, где приложений JavaScript не было. В начале-середине 2000-х JavaScript в основном использовался для создания слайд-шоу и других виджетов, появлявшихся на странице, таких как галереи изображений, средства выбора даты и так далее. Он был недостаточно мощным, чтобы делать многие вещи, не будучи слишком медленным (конечно, компьютеры тоже были медленнее).

    Следует отметить, что jQuery не была единственной и не первой библиотекой. В то время были очень популярны другие, такие как Mootools, YUI, Dojo Toolkit, Scriptaculous и Prototype. jQuery, вероятно, стал самым известным из них позже.

    В то время у браузеров было много проблем с функциональной совместимостью. У нас было много кросс-браузерных особенностей и проблем со стандартизацией, и jQuery помог нам, создав уровень абстракции и позаботившись обо всех обходных путях.

    jQuery позволял вам выбирать элементы DOM, используя синтаксис селекторов CSS, он был очень удобен для пользователя и очень прост в расширении. Это сделало анимацию JavaScript простой.

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

    Сегодня у нас не так много проблем с совместимостью браузеров, а Selectors API и Fetch стандартизировали для браузера две лучшие функции jQuery.

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

    За последние несколько лет его использование, безусловно, сократилось:

    Сегодня ландшафт JavaScript резко изменился. Тем не менее, полезно знать, что jQuery может сделать для вас.

    Вещи, для которых мы использовали jQuery, теперь имеют стандартизированный API браузера

    Выбор элементов DOM

    Способ jQuery:

     $('. button')
     

    Теперь мы можем использовать API селекторов:

     document.querySelector('.button')
     

    если у вас больше элементов:

     document.querySelectorAll('.button')
     

    Дождитесь загрузки DOM

    Способ jQuery:

     $(document).ready(() => {
    //...
    })
     

    Способ DOM:

     document.addEventListener("DOMContentLoaded", () => {
      //...
    })
     

    Добавление или удаление классов из элемента DOM

    Способ jQuery:

     el.addClass('big')
    эл.удалитькласс('большой')
    эл.toggleClass('большой')
     

    Способ DOM:

     el.classList.add('big')
    эл.классСписок.удалить('большой')
    эл.классСписок.toggle('большой')
     

    Удаление элемента из DOM

    Способ jQuery:

     el.remove()
     

    Способ DOM:

     el.remove()
     

    (правильно, без изменений)

    Изменить содержимое элемента в DOM

    Способ jQuery:

     el. text('Hello')
    el.html('Здравствуйте')
    эл.текст()
    эл.html()
     

    Способ DOM:

     el.innerHTML = 'Привет'
    el.textContent = 'Привет'
    эл.внутреннийHTML
    эл.текстКонтент
     

    Выбор родительского элемента в DOM

    Способ jQuery:

     el.parent()
     

    Путь DOM:

     el.parentNode
     

    Прослушивание событий в элементах DOM

    Способ jQuery:

     el.on('click', (e) => { /* ... */ })
     

    Способ DOM:

     el.addEventListener('click', (e) => { /* ... */ })
     

    AJAX-запросы

    Способ jQuery:

     $.ajax({
      URL-адрес: '/api.json',
      тип: 'ПОЛУЧИТЬ'
      успех: (данные) => {
        console.log(данные)
      }
    })
     

    Современный способ JS:

     fetch('/api.json')
      .тогда(ответ => ответ.текст())
      .затем(тело => console.log(тело))
     

    Анимации

    Анимации jQuery теперь можно выполнять в браузере с помощью переходов CSS или анимации CSS.

    Особенности браузера

    Транспилируйте свой код с помощью Babel или используйте специальные полифиллы (polyfill.io)

    Стоит ли вам использовать jQuery сегодня?

    Ответим на вопрос, поставленный в названии этой статьи. Если вы еще не знаете jQuery, стоит ли изучать его сейчас?

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

    Некоторые библиотеки также зависят от jQuery, например Bootstrap. Вы также можете купить готовые шаблоны, которые просто используют его и его плагины.

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

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

    Загрузите мой бесплатный справочник по JavaScript!

    Таблицы данных | Плагин таблицы для jQuery

    4444.AI 44444444.AI 4444444444.AI 4444444.AI 44444444.AI .10-13 4 9007 499.COTT 3 Сан-Франциско

    35 62

    9
    Имя Должность Должность Возраст Дата начала Зарплата
    Tiger Nixon System Architect Edinburgh 61 2011-04-25 $320,800
    Garrett Winters Accountant Tokyo 63 2011-07-25 170 750 долл. США
    Эштон Кокс Младший технический автор Сан-Франциско 66 2009-01-12 $ 86 000
    CEDCRIC KED KEDIRIC KEDIRIC KEDIRCIRIC KEDLIC 900 000
    CEDCRIC KEDIRIC KED. 0038 Senior Javascript Developer Edinburgh 22 2012-03-29 $433,060
    Airi Satou Accountant Tokyo 33 2008-11-28 $162,700
    Бриэль Уильямсон Специалист по интеграции Нью-Йорк 61 02.12.2012 372 000 долл. США
    Ассистент по продажам Херрод Чандлер 380038 San Francisco 59 2012-08-06 $137,500
    Rhona Davidson Integration Specialist Tokyo 55 2010-10-14 $327,900
    Colleen Hurst Разработчик Javascript Сан-Франциско 39 15.09.2009 $205 500
    Соня Фрост Инженер-программист0038 23 2008-12-13 $103,600
    Jena Gaines Office Manager London 30 2008-12-19 $90,560
    Quinn Flynn Support Lead Edinburgh 22 2013-03-03 $ 342 000
    Шарда Маршалл Региональный директор Сан-Франко 3638 Сан-Франко 3638

    -10-10-10-10-10-10-10-10-10-10-10-10-10-10-10-10-10-10-10-101680038

    $470,600
    Haley Kennedy Senior Marketing Designer London 43 2012-12-18 $313,500
    Tatyana Fitzpatrick Regional Director London 19 2010- 03-17 385 750 $
    Майкл Сильва Дизайнер по маркетингу Лондон 66 27. 11.2012 9038 9038 7
    Paul Byrd Chief Financial Officer (CFO) New York 64 2010-06-09 $725,000
    Gloria Little Systems Administrator New York 59 2009 -04-10 $ 237 500
    Брэдли Грир Инженер программного обеспечения Лондон 41 2012-10-13 $ 132 000
    $ 132 000
    $ 132 000
    $ 132 000
    $ 132 000
    .0038 Personnel Lead Edinburgh 35 2012-09-26 $217,500
    Jenette Caldwell Development Lead New York 30 2011-09-03 $345,000
    Юрий Берри Директор по маркетингу (CMO) Нью-Йорк 40 25. 06.2009 $675,000
    3 Служба поддержки Caesar 3 Vance0038 New York 21 2011-12-12 $106,450
    Doris Wilder Sales Assistant Sydney 23 2010-09-20 $85,600
    Angelica Ramos Chief Executive Officer (CEO) London 47 2009-10-09 $1,200,000
    Gavin Joyce Developer Edinburgh 42 2010-12-22 $92,575
    Jennifer Chang Regional Director Singapore 28 2010-11-14 $357,650
    Brenden Wagner Software Engineer San Francisco 28 2011-06-07 $ 206 850
    Fiona Green Главный сотрудник по операции (COO) Сан-Франциско 48 -035-035-031111111111111111111111111111111111111111111111111111111111111111111111111111111111-031 . 0038 $850,000
    Shou Itou Regional Marketing Tokyo 20 2011-08-14 $163,000
    Michelle House Integration Specialist Sydney 37 2011-06 -02 $ 95 400
    SUKI BURKS Девелопер Лондон 53 2009-10-22 $ 11400 500
    $ 11400 500
    .0038 Technical Author London 27 2011-05-07 $145,000
    Gavin Cortez Team Leader San Francisco 22 2008-10-26 $235,500
    Martena McCray Post-Sales Support Эдинбург 46 2011-03-09 $ 324,050
    Unity Butler 8
    BUTLE0035 San Francisco 47 2009-12-09 $85,675
    Howard Hatfield Office Manager San Francisco 51 2008-12-16 $164,500
    Hope Fuentes Секретарь Сан-Франциско 41 12. 02.2010 $109 850
    Вивиан Харрелл 2009-02-14 $452,500
    Timothy Mooney Office Manager London 37 2008-12-11 $136,200
    Jackson Bradshaw Director New York 65 2008-09-26 $ 645,750
    Оливия Лян Инженер поддержки 64 11135 64 11135-038 64 11-02-02-02-02-02-038 64 2011-02-02-02-02-02-038 64 2011-02-02-02-02-038 .0038
    Bruno Nash Software Engineer London 38 2011-05-03 $163,500
    Sakura Yamamoto Support Engineer Tokyo 37 2009-08-19 $ 139 575
    Thor Walton Девелопер Нью-Йорк 61 2013-08-11 $ 98540
    $ 98540
    . 0038 San Francisco 47 2009-07-07 $87,500
    Serge Baldwin Data Coordinator Singapore 64 2012-04-09 $138,575
    Zenaida Frank Инженер-программист Нью-Йорк 63 04.01.2010 $125,250
    Зорита Серрано 3 Инженер-программист0035 56 2012-06-01 $115,000
    Jennifer Acosta Junior Javascript Developer Edinburgh 43 2013-02-01 $75,650
    Cara Stevens Sales Assistant New York 46 2011-12-06 $145,600
    Hermione Butler Regional Director London 47 2011-03-21 $356,250
    Lael Greer Systems Administrator London 21 2009-02-27 $103,500
    Jonas Alexander Developer San Francisco 30 2010-07 -14 $86,500
    Shad Decker Regional Director Edinburgh 51 2008-11-13 $183,000
    Michael Bruce DavaScript Developer Сингапур 29 2011-06-27 $ 183 000
    Donna Snider .
    Имя Позиция Офис Возраст Дата начала Зарплата

    WAW0001

    Richard MacManus

    Ричард является старшим редактором The New Stack и ведет еженедельную колонку о тенденциях в веб-разработке и разработке приложений. Ранее он основал ReadWriteWeb в 2003 году и превратил его в один из самых влиятельных в мире новостных и аналитических сайтов о технологиях. Подпишитесь на него в Твиттере @ricmac.

    jQuery — одна из старейших и наиболее влиятельных библиотек JavaScript в Интернете. По данным BuiltWith, ошеломляющие 78% из 1 миллиона лучших веб-сайтов так или иначе используют jQuery. Что касается самой обсуждаемой сегодня библиотеки JavaScript, React, то ее используют относительно ничтожные 14%.

    jQuery был запущен еще в 2006 году, когда термин «Ajax» был на пике популярности. Ajax (асинхронный JavaScript и XML) давно ушел из языка разработчиков, как и другие технологии JavaScript той ранней эры Web 2. 0. Но jQuery выдержал испытание временем. Действительно, до недавнего времени он все еще рос из года в год. Чтобы узнать последние новости об этой устойчивой технологии, я поговорил с одним из разработчиков, который продолжает поддерживать jQuery, Михалом Голембиовски-Овчареком.

    Gołębiowski-Owczarek был соавтором двух статей в блоге OpenJS Foundation в начале этого месяца, в которых рассказывалось о текущих «усилиях по модернизации» в проекте jQuery. В первом посте было объявлено о новой версии jQuery UI — библиотеки пользовательского интерфейса, построенной поверх базовой библиотеки jQuery. Это будет «последний запланированный выпуск проекта», что означает, что пользовательский интерфейс jQuery теперь находится «в режиме обслуживания». Во втором сообщении было объявлено об устаревании jQuery Mobile, еще одного подпроекта jQuery, который предоставил «систему пользовательского интерфейса на основе HTML5» для мобильных браузеров.

    Оба этих проекта сворачиваются с 2018 года, когда они стали «почетными проектами» OpenJS Foundation. Однако ни одно из объявлений не затрагивает так называемый проект jQuery Core, который продолжает оставаться «проектом воздействия» OpenJS Foundation. Другими словами, основной проект jQuery не исчезнет в ближайшее время.

    Фактор WordPress

    Несмотря на его огромное использование, современные разработчики могут даже не знать, что они используют jQuery. Это потому, что он встроен в ряд крупных проектов, в первую очередь в платформу WordPress. Многие темы и плагины WordPress основаны на jQuery. Библиотека jQuery также является базовым слоем некоторых из самых популярных на сегодняшний день фреймворков и наборов инструментов JavaScript, таких как AngularJS и Bootstrap (версия 4.0 и ниже).

    «Многие сюрпризы в статистике использования jQuery происходят из-за того, что мы живем в пузыре», — сказал мне Голембиовски-Овчарек. «Большинство веб-сайтов не являются сложными веб-приложениями, нуждающимися в сложной структуре, [это] в основном статические сайты с некоторым динамическим поведением — часто написанные с использованием WordPress. jQuery по-прежнему очень популярен там; он работает и прост, поэтому люди не чувствуют необходимости прекращать его использовать».

    jQuery останется частью WordPress еще какое-то время, хотя бы по той причине, что ее будет трудно удалить без нарушения обратной совместимости. Но я спросил Голембиовски-Овчарек, может ли WordPress в конечном итоге отказаться от jQuery?

    «Я думаю, что это уже частично происходит», — ответил он. «Редактор Gutenberg, созданный WordPress, не зависит от jQuery. Так что, по крайней мере, на стороне администратора у них есть варианты, которые от него не зависят».

    Он ожидает, что со временем WordPress перейдет на новые технологии, но это будет постепенный процесс.

    В сообществе разработчиков WordPress «влияние на производительность использования jQuery в темах WordPress» является горячей темой. Существует даже справочный веб-сайт под названием «Возможно, вам не понадобится jQuery», который предлагает советы о том, как заменить jQuery в вашем приложении WordPress. Его аргументация включает тот факт, что с современными браузерами «вам может не понадобиться ничего, кроме того, с чем браузер поставляется».

    Тем не менее, есть еще один документ, который предупреждает, что «разработчики должны знать, что отказ от библиотек, таких как jQuery, может легко потребовать большого количества исследований с их стороны, чтобы избежать ошибок (даже в современных браузерах)». Итак, несмотря на то, что «JQuery мертв?» статьи циркулируют уже несколько лет, по крайней мере, они все еще живы в экосистеме WordPress. Разработчикам предлагается заменить его, но на свой страх и риск.

    Роль jQuery тогда…

    Так как же jQuery стал таким внедрил в сегодняшнюю сеть? Чтобы ответить на этот вопрос, нужно немного истории.

    Когда создатель jQuery Джон Резиг выпустил его в январе 2006 года в BarCampNYC, он написал, что «этот код революционизирует то, как вы можете заставить Javascript взаимодействовать с HTML». В первую очередь он имел в виду тот факт, что jQuery упростил разработчикам работу с DOM (объектной моделью документа). Помните, это было до того, как появился Google Chrome, чтобы встряхнуть мир, так что это была эпоха небольших инноваций в браузерах. У Microsoft Internet Explorer было 85-90% рынка браузеров с доминирующей версией IE6. Даже в то время IE6 имел репутацию исторически плохого браузера.

    Саймон Уиллисон, которого Резиг назвал одним из тех, кто оказал на него влияние при создании jQuery, в июньском сообщении 2006 г. отметил некоторые проблемы разработчиков JavaScript с браузерами:

    «В JavaScript существует ряд проблем (большинство из с несовместимостью браузера), с которыми придется иметь дело любому умеренно сложному приложению — такие вещи, как нормализованная обработка событий, выбор узла DOM, разумная анимация или перетаскивание».

    Ресиг решил решить именно эту проблему, хотя сама jQuery не упоминалась в сообщении Уиллисона. В «большую четверку» ведущих библиотек JavaScript в то время входили Dojo, MochiKit, Prototype/Scriptaculous и библиотека пользовательского интерфейса Yahoo. В своем блоге примерно год спустя Уиллисон признался, что сначала он думал, что jQuery был «милым приемом», но теперь признал его «исключительно умным инженерным решением».

    Таким образом, jQuery был изобретен, чтобы помочь разработчикам справляться с недостатками браузеров того времени.

    … Роль jQuery сейчас

    Какова роль jQuery в современной сети, когда ведущие браузеры (даже Safari!) гораздо лучше соответствуют веб-стандартам? Кроме того, сам стандарт JavaScript значительно улучшился за последнее десятилетие, особенно после выпуска ECMAScript 6 в 2015 году.

    Как уже отмечалось, React стал самой обсуждаемой библиотекой JavaScript на сегодняшний день. Современные фреймворки, особенно Next.js, основаны на React. Другие популярные фреймворки, такие как Angular (преемник AngularJS), имеют собственную экосистему библиотек. Современные фреймворки JavaScript также позволяют разбивать пользовательский интерфейс на компоненты, что упрощает масштабирование приложения.

    «Эти фреймворки предоставляют абстракции для упрощения синхронизации между данными и представлением», — сказал Голембиовски-Овчарек о таких платформах, как Next.js и Angular. «Поэтому их пользователям больше не нужно так часто изменять DOM или обращаться к нему напрямую, и им часто не рекомендуется это делать. В такой среде использование jQuery не имеет особого смысла. Но это лишь малая часть всей веб-экосистемы».

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

    «За эти годы мы значительно улучшили производительность jQuery, — сказал он, — но есть некоторые препятствия, с которыми трудно справиться. Один из них заключается в том, что, чтобы не конфликтовать с браузером, jQuery не изменяет нативные прототипы — как это делали некоторые другие библиотеки (часто позже вызывая проблемы со стандартизацией конфликтующих API), — а вместо этого оборачивает узлы DOM объектами-оболочками jQuery. Каждая операция над такой оберткой создает новую.