Cleaner faster JavaScript, Replacing jQuery with JavaScript

Question

Like many folks I learned JavaScript by learning jQuery.

Lately I have been replacing bits like:

$(this).attr('title') with this.title

$(this).attr('id') with this.id

$(this).val() with this.value

$(this).parent() with this.parentNode

$(this).attr('class') with this.className

Not only is my code cleaner but technically faster.

1. Is this type of reduction acceptable and encouraged?

2. Are there any other common practices I should be doing in raw plain JavaScript instead of jQuery?

3. Are there any potential cross browser issues with this type of reduction-ism?

Answer 1

Whilst using native Javascript functions are generally faster than their jQuery counterparts it does expose you to any browser compatibly issues that may arise from their use. this.value and such is unlikely to cause problems but other similar attributes / functions may well not work in all browsers. Using a framework like jQuery means you dont have to deal with, or worry about, such things.

I would only ever use plain Javascript if performance is an issue i.e. you have a lot of tight loops and repeated operations.