Highlighting rows using "Unobtrusive" JavaScript

As I spoke about briefly in my last article, the modern way to include JavaScript in our pages is to keep it out of the local code (page level code). This method of using JavaScript has been dubbed “Unobtrusive” by the web community for the obvious reason – it does not intrude upon your page code. This keeps things nice and neat and is a big help when it comes time to maintain your scripts.

In order to dive into this concept, let’s take an old tried and true script and update. Some time ago, I wrote a couple of articles on colouring rows and highlighting rows in a data table. We’ll revisit one of those tables, and this time we’ll do it a better way – the unobtrusive way.

Just to note, there isn’t necessarily anything “wrong” with doing it the other way. The method we’ll talk about today is slightly more advanced, so each method has its place.