
Using data‑* Attributes and dataset in JavaScript
Use data attributes and dataset in JavaScript to connect HTML and behaviour cleanly, handle camelCase mapping, event delegation, and string values.
Articles
This is a very broad category within my articles which encompasses any aspect of web development, from initial design and architecture to coding, testing, and deployment.
Below you will find a subset of articles from my blog specifically about Development. This is an area that I have worked with for many years, and have managed to write about quite a few times. There are three hundred thirty‑three collected together for you below.

data‑* Attributes and dataset in JavaScriptUse data attributes and dataset in JavaScript to connect HTML and behaviour cleanly, handle camelCase mapping, event delegation, and string values.
closest() in Vanilla JavaScript and jQueryUse closest() for DOM traversal in jQuery and vanilla JavaScript, replacing manual parent walking in menus, click handlers, and interactive UI cleanly.

classList in JavaScript: add(), remove(), toggle(), and contains()Use classList in JavaScript for add(), remove(), toggle(), and contains(), with cleaner DOM state updates, validation examples, and className cautions.
Handle click events in JavaScript with onclick and addEventListener, including vanilla alternatives to jQuery, event targets, and common interaction patterns.

DOMContentLoaded vs. load in JavaScriptCompare DOMContentLoaded and load in JavaScript, including parsing, asset loading, script timing, selector failures, and when each event is useful.

querySelector Returns null in JavaScriptDebug querySelector returning null in JavaScript by checking selector syntax, DOM timing, missing elements, search scope, and querySelectorAll differences.
Check whether an element exists with jQuery or vanilla JavaScript before running DOM code, avoiding null errors and fragile client‑side behaviour.
Opening a new browser window programmatically on‑click is very simple to achieve with jQuery, and no more complex to achieve with vanilla JavaScript too!
A bug in the WebKit engine that only affects website Retina screen devices means that setting a zero‑blur filter in CSS isn't as easy as it should be.