Реальный пиарJavaScriptJquery → Ненавязчивое (unobtrusive) программирование

Ненавязчивое (unobtrusive) программирование

html 5

Лучшие веб-приложения — это те, которые могут функционировать и при отключенных скриптах, и лучшим методом для достижения этой цели будет ненавязчивый JavaScript, когда события назначаются элементам только после того, как вся HTML-страница у пользователя загрузится (для более подробной информации можно ознакомиться с ненавязчивым программированием и Hijax).
В jQuery присутствует замечательная поддержка этого подхода. Во-первых, парадигма селекторов для выбора узла является основополагающей как для jQuery, так и для ненавязчивого программирования в целом. Во-вторых, jQuery обеспечивает решения для проблемы window.onload, основанной на исследованиях Dean Edwards по поводу работы события "DOM loaded" для различных браузеров. Вы можете выставить функцию-обработчик тогда, когда DOM уже будет к ней готов:

jQuery(document).ready(function() {
alert('DOM готов!');
});

И даже больше, вы можете сократить эту запись, назначив вашу функцию напрямую jQuery():

jQuery(function() {
alert('DOM готов!');
});

jQuery и AJAX
У jQuery лучший API для работы с AJAX, который я когда-либо видел в больших библиотеках. Наиболее простая форма AJAX-вызова выглядит следующим образом:
jQuery('div#intro').load('/some/fragment.html');

Он выполнит GET-запрос к /some/fragment.html и вставит в div#intro HTML-код, который получит.
Что если требуется что-то более сложное, например, вывести индикатор AJAX-загрузки? jQuery предоставляет набор собственных событий (ajaxStart, ajaxComplete, ajaxError и другие) для использования в случае необходимости. Также в этой библиотеки есть и более продвинутый API низкого уровня для сложных AJAX-взаимодействий:

jQuery.get('/some/script.php', {'name': 'Simon'}, function(data) {
alert('Сервер ответил: ' + data);
}); // GET-запрос к /some/script.php?name=Simon

jQuery.post('/some/script.php', {'name': 'Simon'}, function(data) {
alert('Сервер ответил: ' + data);
}); // POST-запрос к /some/script.php

jQuery.getJSON('/some.json', function(json) {
alert('JSON выдал: ' + json.foo + ' ' + json.bar);
}); // Возвращает и преобразует ответ от /some.json как JSON

jQuery.getScript('/script.js'); // GET-запрос к /script.js и eval()

Расширения
Рассматривая весь этот набор функций в стандартной поставке, стоит заметить, что ужатый вариант jQuery занимает всего 20 КБ, и даже еще меньше, если применить архивирование (.gz). Дополнительная функциональность, выходящая за пределы это поставки, может быть организована с помощью расширений, которые могут (и так и делают) добавить новые методы к существующему объекту jQuery. При желании можно выполнить что-то вроде этого:

jQuery('p').bounceAroundTheScreenAndTurnGreen();

Механизм расширений в jQuery обеспечивает задокументированные методы для их добавления в систему. Простота и удобство их использования привлекли большое сообщество авторов таких расширений; справочник расширений насчитывает уже более ста примеров.
Еще одной приятной особенностью является возможность добавлять собственные селекторы так же, как и собственные методы. Расширение moreSelectors добавляет методы типа div:color(red), который, например, выбирает все div с красным текстом.

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


Источник: http://webew.ru

Рекомендуем



Перехватываем события Все JavaScript-библиотеки нуждаются в методах для обработки событий, и jQuery не является исключением


jQuery примеры - работа с выпадающим списком Поэтому я хочу поделиться с Вами информацией о методах работы с конткретными HTML элементами при помощи jQuery


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