Компания «КОРЗИЛЛА»

План

Фреймворк, задачи
Подключение jquery к сайту
Обращение к элементам страницы
Действия с элементами (методы)
События
Практика

Фреймворк Jquery

Фре́ймворк (неологизм от framework — каркас, структура) — программная платформа, определяющая структуру программной системы; программное обеспечение, облегчающее

Подключение к сайту

Подключаем сам файл фреймворка:

Подключаем свой

Обращение к элементам страницы

$(“#content”)
$(“.table_kurs”)
$(“a”)

document. getElementsByID(“#content”)
document. getElementsByClassName(“.table_kurs”)
document. getElementsByTagName(“a”)

Jquery

JavaScript

Действия (манипуляции) с элементами

Работа с атрибутами и свойствами
Работа с

Работа с атрибутами и свойствами

.attr()
.removeAttr()
.prop()
.removeProp()
.addClass()
.removeClass()
.toggleClass()
.hasClass(clName)
.val()

Работа с параметрами и стилями

.css()
.height() .innerHeight() .outerHeight()
.width() .innerWidth() .outerWidth()
.position()
.offset()
.offsetParent()
.scrollTop()
.scrollLeft()

Добавление содержимого

.html()
.text()
.append() .appendTo()
.prepend() .prependTo()
.after() .insertAfter()
.before() .insertBefore()
.wrap() .wrapAll()
.wrapInner()

Удаление содержимого

.detach() .remove()
.empty()
.unwrap()

Замена и клонирование содержимого

.replaceWith()
.replaceAll()
.clone()

События

Базовые
События мыши
События клавиатуры
События формы
События загрузки страницы

Базовые события

.on()
.off()
.bind()
.unbind()
.live()
.die()
.delegate()
.undelegate()
.one()
.trigger()

События мыши

.click()
.dblclick()
.hover()
.mousedown()
.mouseup()
.mouseenter()
.mouseleave()
.mousemove()
.mouseout()
.mouseover()
.toggle()

События клавиатуры

.keydown()
.keyup()
.keypress()

События формы

.focus()
.blur()
.focusin()
.focusout()
.select()
.submit()
.change()

События загрузки страницы

.ready()
.load()
.unload()

События браузера

. error()
.resize()
. scroll()

Практика

Самостоятельное изучение

https://codebra.ru/ru/lessons-additionally/jquery/1/1
https://jquery-docs.ru/