CODEWITHSUNDEEP
javascriptjavascript-frameworkunobtrusive-javascript
Marwan
Marwan

Reputation: 2402

How To Create A High Performance Selectors [no jquery please]

I m a JavaScript pure developer i design my own framework when i tested my selectors module i found a very big issue which is performance

in the selectors module i don't do a very complex selector like jquery i do a simple one my big cause here when i run my selectors in some cases i have to get all elements on the body of the page and have to loop over them to get a specific kind of elements like TD elements for instance , note >>>> dont tell me use getElementsByTagName('TD') cause in my selectors i can make the developer select more than 1 tagName like 

getElementsByTagNames('td,tr')

so in that case i have to get all and then loop over and pic only the needed items

i found that way is very performance eater in the other hand jquery have a hilarious speed to select items doesn't jquery do loops also or what so my main question here

how to do a high performed selectors using JavaScript :)

thanks

Upvotes: 0

Views: 649

Answers (2)

user123444555621
user123444555621

Reputation: 153016

doesn't jquery do loops also or what

jQuery is smart enough to use an existing selector library (sizzle.js).

Sizzle is smart enough to let the browser do the work. document.querySelectorAll does the trick.

edit: actually, sizzle.js used to be inherent part of jquery, but is a separate project now

Upvotes: 6

Elliot Bonneville
Elliot Bonneville

Reputation: 53311

You can still use getElementsByTagName if you do something like this:

function getElementsByTagNames(elements) {
    elements = elements.split(",");
    var foundElements = [];
    for(var i = 0, len = elements.length; i<len; i++) {
        foundElements.push(document.getElementsByTagName(elements[i]));
    }
    return foundElements;
}

Now if you call getElementsByTagNames("tr,div"), an array containing all tr and div elements will be returned.

Upvotes: 3

Related Questions