- It is just a large single .js file that has many pre-built methods and objects that simplify our workflow.
- jQuery was created as a way to help simplify interactions with the DOM(when jQuery was created the convenient methods such as .querySelector() didn’t exist).
- One of the main features is the use of $ sign.
If you don’t want to download jQuery, you can use the direct CDN link https://code.jquery.com/
Actual jQuery Code https://code.jquery.com/jquery-3.1.1.js
Difference between using Vanilla vs jQuery
var testvar = document.querySelectorAll(‘p’)
var testvar = $(‘p’)
So as we can see it saves lot of our typing works
To confirm jQuery is loaded(type $ sign)
<h1>This is an Introduction to jQuery</h1>
<input type="text" name="Name" value="What is your name">
<input type="button" name="ClickMe" value="ClickMe">
Now if I need to change the heading color/background it’s pretty straightforward in case of jQuery
Now if I want to change multiple css properties at the same time,rather then passing one property at a time we can pass object(which act like a dictionary).
Now as we see earlier we can grab multiple objects at once and if want to change color to red it will applied to all items but what would be the case if I want to apply it only to single item,to make it work we need to use eq
NOTE: To grab the last item use negative indexing eq(-1)
Now if I want to change the text,it is pretty straightforward
If I want to change the style of my contents
Now if I want to change attributes
Same way we can change values
Adding and Removing a class