JavaScript and jQuery Standards

standards

Scripts should be externalised where possible to allow / encourage code re-use across the site and to allow browser caching of code across pages.

The data-* attribute should be used to allow variables to be passed from the template to the external scripts. Note attribute should be  lower case as per the HTML5 spec.

Where Classes are placed in HTML as event listeners for JS. Can I suggest prepending the class with a “js-” so for example class=”js-fulltextviewer” can easily be identified as a class that is used as an event listener.

Script files should be called just before closing HTML tag. This is to maximum performance to allow script loading to be deferred till after the template has been loaded.

jQuery code should be written following best practise .. A good set of guidelines are the following I believe……

A good place to start to determine the quality of your javascript code is to try adding it on jshint. Note if your using jquery as a dependency you will have to declare $ as a variable to avoid getting false negatives….

if you then want to improve it further you can put it through the JSLint checker at www.jslint.com. You will need to set the following options:

JSLint Options

  • missing ‘use strict’ pragma
  • many var statements per function
  • messy white space (this may not be needed)

In addition, tell JSLint about the following global variables:

  • document
  • window
  • $
  • jQuery
    Backstreets of Hickory says:
    April 7, 2019 Reply

    Hello are using WordPress for your blog platform? I’m new to the blog world but I’m trying to get started and set up my own. Do you require any html coding expertise
    to make your own blog? Any help would be really
    appreciated! http://backstreetsofhickory.com/

Leave a Comment

Your email address will not be published.