В этом уроке мы приведем несколько примеров регулярных выражений (RegExp) jQuery, которые вы можете использовать в своих проектах. Они очень удобны для поиска и проверки почти всех данных, которые есть на вашей веб-странице. Также, они удобны для проверки значений в формах.
Просто рецепт если вам нужно удалить слово из готовой HTML-страницы. view plainprint? var el = $('#id'); el.html(el.html().replace(/слово/ig, "")); Вам осталось только поменять "слово" на свой вариант.
Универсальная функция итерации (выполнения цикла), которая может быть использована для итерирования и объектов, и массивов. Массивы и массивоподобные объекты со свойством length (такие как объект аргументов у функций) можно итерировать по числовому индексу от 0 до length-1. Другие объекты итерируются по названию своих свойств. Метод появился в jQuery 1.0.
На сегодняшний день разнообразие мониторов, а точнее их разрешения, настолько велико, что веб дизайнерам очень сложно подобрать фон, который подходил бы под все разрешения. И снова нам на помощи приходит jQuery который создаст "резиновый" фон, который будет меняться в зависимости от размеров экрана браузера.
Сначала добавляем изображение на страницу и назначаем ему id ‘background-image’. При помощи JavaScript, вычисляем размеры экрана пользователя, для того, чтобы в нормальном виде отобразить изображение.
Используя jQuery, мы можем манипулировать размерами изображения посредством правил CSS:
Изучать jquery я начал пару месяцев назад по долгу службы, и очень скоро понял насколько это удобно. Причем не только если разрабатываешь какое-нибудь ajax-приложение, но и в более мелких вещах — таких как простенькие анимации, выпадающие менюшки и тд.
В этой статье я опишу как можно с помощью jquery обычное многоуровневое меню сделать раскрывающимся без правки исходного html-кода. Для этого допустим, что на сайте есть такое меню:
Ниже я покажу 2 разные техники как получить фоновое изображение , тянущееся на всю страницу, в независимости от разрешения экрана:
Требования:
* Заполняет всю страницу с изображением, без пробелов * Сохраняет пропорции изображения * Нет полосы прокрутки * Кросс-браузерность * Не Flash РЕШЕНИЕ НОМЕР 1
Сегодня я расскажу о том, как сделать jQuery плагин. А чтобы не делать что-то абстрактное, давайте сделаем вот такой плагин для текстового поля: есть текст по умолчанию и какой-то класс. При фокусе в это поле убирается класс и дефолтный текст, при блюре на нем — если ничего не введено, то текст и класс возвращаются домой. Такие штуки модные парни обычно используют для полей поиска, но они могут пригодиться нам и для других полей.
В программе урока: как делать плагин к jQuery, реализация простого плагина и аналог такого скрипта под Mootools (не все же одно jQuery). Структура плагина
Для начала посмотрим на общую структуру плагина. Я написал комментарии к каждой строчке, так что смотрим на код:
<script type="text/javascript"> // так вот начинается описание плагина (с названием somePlugin) (function($) { $.fn.somePlugin = function(options) { // значение по умолчанию для опциональных аргументов // в виде имя: значение var defaults = { someOption: 'someValue' }; // расширяем дефолтные значения опциями var opts = $.extend(defaults, options); // они теперь доступны как opts[имя_опции] // вот тут сам плагин }; })(jQuery); </script>
Анимация: концепция, которая часто вызывает противоположные реакции людей. Некоторые хвалят ее полезность, в то время как прочие клянут за слишком частое применение. Тем не менее, правильно используемая анимация часто оживляет пользовательский интерфейс и делает его гораздо более привлекательным и аккуратным. В этом учебнике мы начнем с основ jQuery, затем узнаем, как создать свою первую анимацию, затем как построить эффекты и, наконец, разработаем нечто действительно высококлассное.
Заинтересованы? Давайте начнем прямо сейчас! Пожалуйста, заметьте, все адресовано исключительно новичкам, поэтому я буду заострять внимание на некоторых моментах. Шагайте вместе со мной. Если вам интересно, посмотрите в первой части демо-ролика простой эффект, который мы сегодня построим.
Шаг 1. Основы jQuery
jQuery – это библиотека JavaScript, которая упрощает для нас, разработчиков, конструирование самых лучших, функциональных, интерактивных веб-сайтов и пользовательских интерфейсов при помощи как можно меньшего количества строк кода.
Обычная строка кода выглядит вот так: view sourceprint? 1.$(DOM Element).something();
Давайте рассмотрим каждую ее часть:
$ – сокращение от «объект jQuery». Используйте jQuery в случае, если вы берете другую рамку на той же самой странице, как здесь: jquery(DOM Element).something();
(DOM Element) – элемент, с которым вы что-то хотите сделать. Это один из тузов в рукаве jQuery. Здесь для получения одного из элементов можно использовать селекторы CSS. Любое объявление, которое работает в CSS-документе, может быть употреблено здесь. ID, классы, псевдоклассы – все, что хотите.
something() – то, что нужно сделать с полученным элементом. Это может быть все, что угодно – от скрывания элемента до AJAX-вызова к обработчику событий.
Здесь мы собираемся всего лишь придерживаться функциональности, связанной с анимацией и эффектами.
Статья создана для того, чтобы помочь начинающим использовать jQuery.
Загрузить саму библиотеку можно здесь jQuery.
Для начала создадим тестовую HTML-страничку со следующим содержимым: <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> </script> </head> <body> <a href="http://jquery.com/">jQuery</a> </body> </html>
Измените значение атрибута src в теге <script> так, что бы он указывал на Вашу копию библиотеки jquery.js. Если jquery.js расположен в той же директории, что и Ваш HTML-файл, то оставьте src = «jquery.js»
Внимание: Если страница подключается с помощью PHP функций include() или require(), убедитесь, что данный код расположен внутри <body>, а не внутри <head>. Подключение скрипта jQuery внутри <head> не будет работать.
Когда jQuery, библиотека JavaScript, увидела свет в январе 2006, все подумали: «очередная красивая игрушка». Выбор CSS-селекторов в качестве базиса было, конечно, изящной идеей, но использование цепочек преобразований выглядело немного замысловато, и сама библиотека, по-видимому, не покрывала всех возможных случаев. jQuery расценивали тогда только как временное и проходящее решение.
Только несколько месяцев спустя стало понятно, что jQuery является просто произведением инженерного искусства. Она умело покрывает достаточно широкий диапазон повседневных функций и предоставляет при этом удобный API для расширений, с помощью которых можно добавить любую другую функциональность. Абстрактность в ней заложена на уровне ядра — речь идет о выборе элементов объектной модели документов (DOM) — и она извлекает из него максимум пользы. И что важнее всего, использование этой библиотеки подразумевает следование хорошему стилю в программировании и хорошо сочетается с другими частями JavaScript-кода.