jQuery Refresher
jQuery isn’t a language, but rather a Javascript library that, depending on who you ask, simplifies and streamlines the process of writing Javascript code. To understand and use jQuery, one must then have first picked up Javascript itself. At Flatiron, jQuery was taught but not emphasized, nor was it mandated for use. Though we spent about a week learning it, I ultimately completed the remainder of my Javascript-based lessons and projects in native Javascript. But it is a library I spent some time learning, so to keep jQuery on my resume, I thought a quick refresher would be in order.
In simple terms, jQuery is a fancy version of document.querySelector(). For example, in:
$("#yo").append("what is up")Here, the #() is the selector, #yo is the HTML element being selected (be sure to set it as a string), and .append() is the jQuery function that adds text to the selected element.
You can load jQuery in index.html by loading a script.js file (no required name) that links to jQuery’s googleapis.com URL. The line will look something like:
<script src = "script.js"></script>This is generally placed at the bottom of the <body> in index.html. And yes, the order matters, as jQuery needs to be loaded first if it’s used in the other Javascript files. It’s not safe to execute Javascript code until the browser lets us know it’s ready (aka the HTML has been loaded). As a side note, you should not write either Javascript or jQuery inside HTML or CSS.
Every line of jQuery code usually begins with $(‘selector-name’). So similarly to regular Javascript, the jQuery version of an element selector that returns all HTML elements with the inputted tag would look like:
$('img')The above would return all img elements.
$('.pics')The use of a period indicates a class selector.
$('#hello')The pound sign (#) is an ID selector.
$('ul li')This would be a jQuery descendant selector that selects all list elements inside the ul tag.
These are just some examples of the various functions made available by the jQuery library. The only way to really familiarize yourself with them is to use them, so I definitely plan on building a project in jQuery in the near future.