Май
27
2011

Изучаем jQuery | Урок 2 «Действия с элементами»

Если вы хорошо ознакомились и выучили мой 1 урок «Выборка элементов», тогда можно смело приступать к прочтению этого урока.
Итак в предыдущем уроке мы изучали выборку элементов, а теперь действия с этими элементами. Для примера выборка будет параграфа < р >.
1. $(«p»).click('function() { функция при клике мышкой на выбранный элемент }'); — функция работает при клике на элемент. Пример используется в второй функции.

2. $(«p»).text('Текст для вставки'); — функция text используется для замены или вставки текста в нужное место. Пример:

3. $(«p»).hide(время, function() { функция после скрытия элемента (необязательно) }); — срытие элемента. Пример:

4. $(«p»).show(время, function() { функция после вывода элемента (необязательно) }); — вывод элемента. Пример:

5. $(«div»).width(размер); — изменение ширины. Пример:

Нажми на меня и я увеличусь немного.

6. $(«div»).height(размер); — изменение высоти. Пример:

Нажми на меня и я увеличусь немного.

7. $(«p»).html(«html код»); — вставляет html код в элемент. Пример:

Нажми на меня и вставится html код.

8. $(«p»).fadeIn(время); — появление елемента.

9. $(«p»).fadeOut(время); — скрытие елемента.

10. $(«p»).fadeTo(время, число от 0 до 1); — затемнение елемента.

11. $(«p»).slideDown(время); — развернутся вниз (любые горизонтальные меню используют.)

12. $(«p»).slideUp(время); — свернутся вверх.

13. $(«p»).toggle(function() { }, function() { }); функция при первом клике и при втором (обычно используется как свернуть-развернуть).

14. $(«p»).attr(«атрибут»); — вытягивания значения атрибута, .attr(«атрибут»,значение); — замена значения атрибута.

15. $(«p»).addClass(«класс»); — добавить клас (CSS)

16. $(«p»).removeClass(«класс»); — удалить класс (CSS)

17. $(«p»).css(«атрибут»,"свойство"); — добавить один CSS атрибут. .css({"атрибут":"свойство","атрибут":"свойство"}); — добавить куча CSS атрибутов.

18. $(«p»).animate({"что анимировать например width":"и значение например 450px"},время); — моя любимая функция используется в этом уроке и сбоку в меню и впрочем везде =).

19. $(«p»).before(«HTML код»); — вставить HTML перед выбранным элементом.

20. $(«p»).after(«HTML код»); — вставить HTML после выбранного элемента.

21. $(«p»).prepend(«HTML код»); — вставить HTML в выбранный элемент в начале.

22. $(«p»).append(«HTML код»); — вставить HTML в выбранный элемент в конце.

23. $(«p»).each(function() { }); — провести функцию над всеми выбранными элементами.

24. $(«p»).size(); — количество выбранных элементов.

25. $(«p»).get(номер обьекта); — выбрать обьект.

26. $(«p»).clone(); — клонировать выбранный обьект.

27. $(«p»).remove(); — удалить элемент.

Это самые используемые функции jQuery так скажем основы jQuery все базируется на вот этих простых функциях...

Вам будет интересно прочитать и это:

Об авторе: Петро Бородатий

Создаю веб-сайты, пишу скрипты для популярных CMS, веду блог. Программист портала AdvertsMarket.net.

Оставить комментарий

Услуги

Веб-студия "MKSITE"

Реклама от Google

Социальные сети

Партнеры

Система Orphus