Web Performance in Action

Appendix B. Native equivalents of common jQuery functionality

In chapter 8, I discussed the importance of embracing minimalism in your website’s JavaScript. A way of getting there is to drop jQuery altogether and use what’s available in the browser. This appendix highlights some common jQuery functions and then shows you how to accomplish the same tasks by native means. This isn’t a complete reference. Such a thing would be far beyond the scope of an appendix. This is to get you started.

B.1. Selecting elements

jQuery’s core $ method selects DOM elements by using a CSS selector string like so:

$("div");

This selects all <div> elements on a page. Generally speaking, whatever valid CSS selector that works in the $ method will work with document.querySelector ...