Например, jQuery. Простые примеры скриптов jQuery


Опубликованно 29.03.2018 11:50

Например, jQuery. Простые примеры скриптов jQuery

jQuery-это библиотека JavaScript, которая позволяет разработчикам добавить дополнительные функции на своих сайтах. Он является открытым исходным кодом и доступен бесплатно по лицензии MIT. В последние годы, jQuery стала самой популярной библиотеки JavaScript используется в веб-разработке.Пример jQuery

Для реализации jQuery, веб-разработчик для создания ссылки на файл JavaScript в HTML-код веб-страницы. На некоторых сайтах размещают локальную копию, в то время как другие ссылаются на библиотеки или на сервере Google. Например, веб-страница может загрузить библиотеку jQuery, используя следующую строку в раздел <head> HTML-код (например, jQuery и cookies):

<script type="text/javascript"

SRC="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

Примеры jQuery и Ajax

После загрузки библиотеки веб-страницы может вызывать любые функции, поддерживаемые библиотеки. Общие примеры включают редактирование текста, обработки данных формы, перемещение элементов на странице и запуска анимации. jQuery может также работать с Ajax-источников и языков сценариев, таких как PHP и ASP, для доступа к данным базы данных. Как jQuery выполняется на стороне клиента (не веб-сервера), он может обновлять информацию на веб-странице в режиме реального времени, без перезагрузки страницы. Общий пример автозаполнения, в котором форма поиска автоматически отображаются общие данные при вводе запроса.Преимущества библиотеки

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

Описание

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

Набор основных функций:выбор элементов DOM;анализ и манипуляции с использованием механизма выбора;новый стиль программирования;алгоритмы слияния и структуры данных DOM.

Стиль повлиял на архитектуру других фреймворков JavaScript, такие как YUI v3 и Додзе, и стимулировало создание стандартных Selectors API.

Microsoft и Nokia поставляют jQuery на их платформах. Microsoft включает в себя Visual Studio для использования в рамках ASP.NET AJAX и ASP.NET MVC, Nokia, встроенный в платформу разработки веб-виджет в режиме реального времени.

Презентация

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

Библиотека использует эти предполагаемые функции JavaScript, такие как fade-in и fade-outs, при скрытии элементов, анимация и элементы jQuery CSS. jQuery также обеспечивает парадигму для управления событиями, которая выходит за рамки выбора и манипуляции элементами DOM. Назначение события, а определение функции обратного вызова выполняются один шаг в одном месте в коде.

Принципы разработки с помощью jQuery (примеры):Разделение HTML и JavaScript — библиотека предоставляет простой синтаксис, чтобы добавить обработчики событий в модели DOM в JavaScript, вместо того, чтобы добавить атрибуты, события HTML, чтобы вызвать функцию JS. Таким образом, он призывает разработчиков полностью отделить код JavaScript в HTML-разметке.Краткость и ясность, способствует краткости и ясности с такими инструментами, как каналы и имена функций.Устранение кросс-браузерные несовместимости — JavaScript-двигатели разных браузерах немного отличается, так что JS код, который работает для браузера может не работать для другого. Как и другие наборы инструментов JavaScript, jQuery обрабатывает все эти мульти-браузер несоответствий и обеспечивает интерфейс, который работает во всех браузерах.Расширяемость — новые события, элементы и методы могут быть легко добавлены, а затем снова используется в качестве plug-in.История

jQuery была выпущена в январе 2006 года, Баркемп нью-ЙОРК John Сети и находился под влиянием раннего библиотеки cssQuery Dean Edwards. В настоящее время он поддерживается командой разработчиков под руководством Тимми Эллисон (с двигателем селектора jQuery — Шипение, режиссер Ричард Гибсон).

Характеристики

Библиотека включает в себя следующие функции:выбор элементов DOM с несколькими серверами механизм селектора с открытым исходным кодом Шипение;выбор проекта DOM-манипуляции на основе селекторов CSS, которые использует имена и атрибуты элементов, таких как id и class, в качестве критериев для выбора узлов в DOM;деятельности;эффекты и анимации;ajax;висящих предметов и перспективных для управления асинхронной обработки;парсинг JSON;расширяемость с помощью плагинов;утилиты, такие как определение функций;средств совместимости, которые изначально доступны в современных браузерах, но нуждаются в более ранних версиях, таких как inArray () и each (), мульти-браузер (не путать с кросс-браузер).Использование

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

Пример jQuery PHP:

<script src="jquery.js"></script>

Стили

jQuery имеет два стиля использования:С помощью функции $, это на заводе метода для объекта jQuery. Эти функции часто называются команды целы, потому что они возвращают объекты jQuery.По $ — префикс-функции. Это задача функции, которые не действуют непосредственно на объект.

Доступ к JQuery и опала несколько узлов DOM, как правило, начинается с вызова функции $ с помощью цепи селектора CSS. Он возвращает объект jQuery, который ссылается на все элементы HTML-страницы.Неполной режиме

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

Его дополнительные возможности

Функция обратного вызова для обработки событий для элементов, которые еще не загружены, могут быть сохранены внутри .ready () в качестве анонимной функции. Эти обработчики будут вызываться, только когда событие срабатывает. Например, следующий код добавляет обработчик щелчка мыши на элемент изображения img:

$(function (){

$(\'img\').on(\'click\',function(){

//обрабатываем событие click на любой элемент img на странице

});

}).

Некоторые функции возвращают определенные значения (например, $(\'#input-user-email\').Val()). В этих случаях строка не работает, потому что значение не ссылается на объект jQuery.Создание новых элементов

Помимо доступа к сайтам, DOM через иерархию объектов, это также можно создавать новые элементы, если строка передается в качестве аргумента $ (), выглядит как HTML. Например, строка поиска пункт выбора HTML, содержащий карты и добавляет элемент параметр со значением VAG и текст Volkswagen:

$(\'# выберите carmakes\')

.append($(\'<option/>\')

.attr({значение:VAG})

.append (Volkswagen)).Утилиты

Функция jQuery с префиксом $ , функций полезности, которые влияют на свойства и поведение. Следующий пример использует функцию each (), которая выполняет итерации массивы:

$.each([1,2,3],function(){

консоли.log(a+1);

});

Этот пример post jQuery сохраняет 2, 3, 4 на консоли.Ajax

Вы можете сделать кросс-браузер Ajax запросов с помощью $ .ajax () jQuery, пример того, что может служить из способов загрузки и обработки данных на расстояние:

$.ajax({

type: POST,

url: \'/process/submit.php\',

данных: {

имя: Джон,

местоположение: \'Бостон\',

},

}).done(function(msg){

alert(\'Data Saved:" +msg);

}).fail(function(xmlHttpRequest, statusText, errorThrown){

alert(

\'Не удалось отправить ваше сообщение.N \'

+\'XML Http Request:\'+JSON.stringify(xmlHttpRequest)

+ \', Status Текст:\'+statusText

+ \', Error Thrown:\'+errorThrown);

});

В этом примере, на сервере указано имя=Джон и location=Boston /process/submit.php. Если этот запрос не выполняется, то функция называется, чтобы предупредить пользователя. Если запрос не удалось, он уведомляет пользователя об ошибке, состояние спроса и ошибках.Plug-ins

Архитектура jQuery позволяет разработчикам создавать plug-in код для расширения различных функций. В интернете, тысячи плагинов, которые охватывают различные функции, такие как поддержка Ajax, web services, динамических списков, инструменты XML и XSLT, перетаскивание, события, обработка cookies модальное диалоговое окно.

Есть и другие плагины для поисковых систем, таких как jquer.in, которые используют подходы, такие, как перечисление только плагинов, отвечающих определенным критериям (например, тех, которые имеют общедоступный репозиторий кода). Разработчик предоставляет «Центр обучения» ресурс jQuery для новичков, который может помочь пользователям понять, JavaScript и начать разрабатывать плагины.jQuery UI

jQuery UI-это набор виджетов ГРАФИКА, анимация и визуальные эффекты с тем, сделанные с помощью jQuery, CSS, (JavaScript, css и HTML. По данным службы аналитики JavaScript, Libscore, пользовательского интерфейса jQuery используется более 197000 лучших веб-сайтов, что делает его вторым библиотеки JS. Самые известные из них: Pinterest, PayPal, Rating, The Huffington Post и Netflix.

jQuery UI-бесплатно и с открытым исходным кодом, распространяется Foundation под лицензией MIT. Он был выпущен в сентябре 2007 года.jQuery Mobile

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



Категория: Новости