用于类/ id选择的jQuery的轻量级替代

Nij*_*kun 13 jquery dom css-selectors

假设我想构建一个非依赖的javascript框架/脚本.有没有办法利用jQuery的惊人的类和元素选择功能

$('.this') or $('#this') or $('div', '.this')
Run Code Online (Sandbox Code Playgroud)

不依赖于jQuery或使用jQuery(如果可用)但如果没有,它可以在没有它的情况下工作吗?我搜索了这个高低.也许我正在搜索错误,因为我得到的最接近的是:

选择没有jQuery的元素

但是,这并不像我想要的那样深入或类似于我想要的jQuery.我已经考虑过挖掘jQuery源代码并将其删除并使用它,但我希望有人已经完成了这个并且我只是在错误的地方寻找并且其他人知道它.

更新

这有几个方面的答案,谢谢你的快速回复.我在用错误的方法搜索.我终于来了:https://github.com/ded/qwery

然而,这里的答案完美地完成了工作: jQuery用于类/ id选择的轻量级替代

Gre*_*tit 14

你可以做jQuery做的事情并使用Sizzle:http://sizzlejs.com/


DA.*_*DA. 13

"我需要一个小型JS库......"的答案就是这个网站:http://microjs.com/

具体来说,你正在寻找一个选择器引擎:

http://microjs.com/#css


Bri*_*kel 5

除了IE6和IE7之外,您可以使用document.querySelectorAllsomeElement.querySelectorAll执行类似的选择功能.

更新更多细节:

它看起来像ZeptoJS做了以下.它使用了快速的函数$$(document, '#myid'),$$(document, '.myclass'),$$(document, 'div')和搜索速度慢$$(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)
    );
}
Run Code Online (Sandbox Code Playgroud)