Just a
word of caution: It may worth your while to spend a bit more time and effort to consolidate your JavaScript skills before diving into jQuery at this point in time.
jQuery is a JavaScript library and using jQuery requires writing JavaScript code, so having a good grasp of JavaScript is essential for using jQuery competently.
It is unreasonable to expect to "pick up JavaScript on the side" by learning jQuery - all you are really doing is investing time and effort into learning jQuery and the jQuery way of doing things.
There is no argument that jQuery is invaluable when working with traditional, non-SPA web applications. It is used with older SPAs written with Backbone.js; even
AngularJS 1.x included a
jQLite gizmo - but then in the
FAQ: Common Pitfalls you'll find this:
Stop trying to use jQuery to modify the DOM in controllers. Really. That includes adding elements, removing elements, retrieving their contents, showing and hiding them. Use built-in directives, or write your own where necessary, to do your DOM manipulation. See below about duplicating functionality.
If you're struggling to break the habit, consider removing jQuery from your app. Really. Angular has the $http service and powerful directives that make it almost always unnecessary. Angular's bundled jQLite has a handful of the features most commonly used in writing Angular directives, especially binding to events.
In fact many people "raised" on jQuery seem to struggle when transitioning to another framework like AngularJS (
example - well, they call AngularJS opinionated for a reason).
Also modern JavaScript frameworks like AngularJS 2.x and React tend to implement a shadow or virtual DOM (there is even the minimalistic
virtual-dom library). For performance and convenience reasons you are supposed to manipulate the framework's virtual DOM and leave the browser's DOM to the framework - in this situation jQuery cannot be used because it can only manipulate the browser's DOM and not the virtual DOM and jQuery's interference is going to lead to undesirable behavior from the "the other" framework. Typically the "other framework's" mental-model-of-the-browser-DOM is in some way based on the Ye Olde
mess of a DOM (though 7 years later things are a little better) - so ultimately there is no escaping the DOM in the browser.
jQuery in Action, 3e; "about this book" p. xxv:
The book assumes a fundamental knowledge of HTML, CSS, and JavaScript ... To top it all off, we have provided an appendix highlighting key JavaScript concepts such as function contexts and closures—essential to make the most effective use of jQuery on our pages—for readers who are unfamiliar with, or would like a refresher on, these concepts.
The 16 page appendix "JavaScript that you need to know but might not!" has to be well understood before venturing into jQuery.
If you don't have access to the book you could try:
YDKJS Up & Going | Kyle Simpson
jQuery Fundamentals - JavaScript Basics | Rebecca Murphey
Understanding JavaScript makes it easier to understand all the JavaScript-related stuff. This is now more important than ever because
npmjs/
nodejs have become an integral part of the web development tooling pipeline - no help from jQuery here as there is no HTML, CSS, and DOM to deal with; only pure JavaScript and some nodejs. Example:
webpack.
So you know jQuery. Now What? | Remy Sharp (2013)
