Intro to jQuery
An Easier Way?
Key Questions
- What is jQuery
- What is a library?
- Why would you use jQuery?
- Why would you not use jQuery?
What is jQuery?
jQuery is a DOM manipulation library
What is jQuery?
It comes with a bunch of useful methods to things like:
- Select Elements
- Manipulate Elements
- Create Elements
- Add Event Listeners
- Animate Elements
- Add Effects
- Make HTTP Requests(AJAX)
Why Use jQuery?
- Fixes "broken" DOM API
- Brevity and Clarity
- Ease of use
- Cross-Browser Support
- AJAX
- Lot's of people use jQuery!
Why Not Use jQuery?
- The DOM API is no longer "broken"
- It doesn't do anything you can't do on your own
- It's an unnecessary dependency
- Performance
- Lot's of people are moving away from jQuery!
Either way, it's worth knowing.
Adding jQuery
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script type="text/javascript" src="jquery.js"></script>
Download jQuery and link to it locally:
OR
Link to a CDN(a hosted copy)
Quick Preview
Here's a 30 second preview of what jQuery looks like:
//when a user clicks the button with id 'trigger'
$('#trigger').click(function(){
//change the body's background to yellow
$('body').css("background", "yellow");
///fade out all img's over 3 seconds
$('img').fadeOut(3000, function() {
//remove imgs from page when fadeOut is done
$(this).remove();
});
});
Intro to jQuery
By Colt Steele
Intro to jQuery
- 1,721