jQuery Examples

[Guest]

jQuery Examples


Do you want to test your jQuery selector skills?
Try Our
jQuery Selector Tester

jQuery Selectors

$("p").hide() - Hide all <p> elements
$("#test").hide() - Hide the element with id="test"
$(".test").hide() - Hide all elements with class="test"
$(this).hide() - Hide the current HTML element

Selectors explained

jQuery Events

jQuery click()
jQuery dblclick()
jQuery mouseenter()
jQuery mouseleave()
jQuery mousedown()
jQuery mouseup()
jQuery hover()
jQuery focus() and blur()

Events explained







jQuery Hide/Show

jQuery hide()
jQuery hide() and show()
jQuery toggle()
jQuery hide()

Hide and Show explained

jQuery Fade

jQuery fadeIn()
jQuery fadeOut()
jQuery fadeToggle()
jQuery fadeTo()

Fade explained

jQuery Slide

jQuery slideDown()
jQuery slideUp()
jQuery slideToggle()

Slide explained

jQuery Animate

jQuery animate()
jQuery animate() - manipulate multiple CSS properties
jQuery animate() - using relative values
jQuery animate() - using pre-defined values
jQuery animate() - several calls after each other

Animate explained

jQuery Stop Animations

jQuery stop() sliding
jQuery stop() animation (with parameters)

Stop Animations explained

jQuery HTML Get Content and Attributes

jQuery text() and html() - Get content
jQuery val() - Get content
jQuery attr() - Get attribute value

Get Content and Attributes explained

jQuery HTML Set Content and Attributes

jQuery text(), html(), and val() - Set content
jQuery text() and html() - Set content with a callback function
jQuery attr() - Set attribute value
jQuery attr() - Set multiple attribute values
jQuery attr() - Set attribute value with a callback function

Set Content and Attributes explained

jQuery HTML Add Elements/Content

jQuery append()
jQuery prepend()
jQuery append() - Insert several new elements
jQuery after() and before()
jQuery after() - Insert several new elements

Add Elements/Content explained

jQuery HTML Remove Elements/Content

jQuery remove()
jQuery remove() - with a parameter
jQuery empty()

Remove Elements/Content explained

jQuery Get and Set CSS Classes

jQuery addClass()
jQuery addClass() - Multiple classes
jQuery removeClass()
jQuery toggleClass()

Get and Set CSS explained

jQuery css() Method

jQuery css() - return CSS property
jQuery css() - set CSS property
jQuery css() - set CSS properties

The css() method explained

jQuery Dimensions

jQuery - return width() and height()
jQuery - return innerWidth() and innerHeight()
jQuery - return outerWidth() and outerHeight()
jQuery - return outerWidth(true) and outerHeight(true)
jQuery - return width() and height() of document and window
jQuery - set width() and height()

Dimensions explained

jQuery Traversing Ancestors

jQuery parent()
jQuery parents()
jQuery parentsUntil()

Traversing Ancestors explained

jQuery Traversing Descendants

jQuery children()
jQuery find()

Traversing Descendants explained

jQuery Traversing Siblings

jQuery siblings()
jQuery next()
jQuery nextAll()
jQuery nextUntil()

Traversing Siblings explained

jQuery Traversing Filtering

jQuery first()
jQuery last()
jQuery eq()
jQuery filter()
jQuery not()

Traversing Filtering explained

jQuery Filters

Filter table
Filter list
Filter anything

Filters explained

jQuery AJAX load() Method

jQuery load()
jQuery load()
jQuery load() - with callback

AJAX load() explained

jQuery AJAX get() and post() Methods

jQuery get()
jQuery
post()

AJAX get() and post() explained












★
+1

Reference: https://www.w3schools.com/jquery/jquery_examples.asp