Let's say I want to build a non-dependent javascript framework/script. Is there a way to utilize jQuery's amazing class and element selecting functionality
$('.this') or $('#this') or $('div', '.this')
Without being dependent on jQuery or using jQuery if it is available but if not, it works without it? I have searched this high and low. Maybe I am searching incorrectly as the closest I have gotten is this:
Selecting elements without jQuery
However, that is not as in-depth as I want or as similar as I want to jQuery. I have thought about digging through jQuery source and gutting that piece out and using it, but I hope someone has already done this and I am just looking in the wrong place and someone else knows about it.
Update
This has been answered in a few ways, and thank you to the quick replies. I was searching in the wrong method. I finally came on: https://github.com/ded/qwery
However this answer here does the job perfectly: Lightweight alternative to jQuery for class / id selecting
ID Selector: The jQuery #id selector selects the element on the basis of the ID attribute of the HTML tag. This selector is basically used when we have to work on a single element because an ID should be unique within a web page.
As you said, the ID is the faster lookup, but which one you chose has more to do with what you want to do. Think of a class like a category, or classification for different items that have a common or shared aspect to them, while an ID in contrast, has some unique property it is one of a kind.
jQuery has become extremely important in the web because of various advantages like it is extremely lightweight compared to javascript, easy to learn and implement. jQuery pages load very quickly. HTML, CSS, Javascript are the technologies that are understood by Web.
In everything but IE6 and IE7, you can use document.querySelectorAll
or someElement.querySelectorAll
to perform similar selection functionality.
Update more details:
It looks like ZeptoJS does the following. This uses quick functions for $$(document, '#myid')
, $$(document, '.myclass')
, $$(document, 'div')
and slow searches for $$(document, 'div > .myclass')
var classSelectorRE = /^\.([\w-]+)$/,
idSelectorRE = /^#([\w-]+)$/,
tagSelectorRE = /^[\w-]+$/;
$$ = function(element, selector){
var found;
return (element === document && idSelectorRE.test(selector)) ?
( (found = element.getElementById(RegExp.$1)) ? [found] : [] ) :
Array.prototype.slice.call(
classSelectorRE.test(selector) ? element.getElementsByClassName(RegExp.$1) :
tagSelectorRE.test(selector) ? element.getElementsByTagName(selector) :
element.querySelectorAll(selector)
);
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With