在不使用库的情况下，使用 css 选择器查找 Dom 元素的最简单方法是什么？
function select( selector ) {
return [ /* some magic here please :) */ ]
};
select('body')[0] // body;
select('.foo' ) // [div,td,div,a]
select('a[rel=ajax]') // [a,a,a,a]
这个问题纯属学术性的。我有兴趣了解这是如何实现的以及“障碍”是什么。这个函数的预期行为是什么？ （返回数组，或返回第一个 Dom 元素等）。
【问题讨论】：
除了自定义hacks，在最近的浏览器中你可以使用W3C Selectors API Level 1中定义的原生方法，即document.querySelector()和document.querySelectorAll()：
var cells = document.querySelectorAll("#score > tbody > tr > td:nth-of-type(2)");
【讨论】：
这是我用过几次的不错的 sn-p。它真的很小很整洁。它支持所有常见的 css 选择器。
【讨论】：
如今，在没有图书馆的情况下做这种事情是疯狂的。但是，我假设您想了解这些东西是如何工作的。我建议您查看 jQuery 或其他 javascript 库之一的源代码。
考虑到这一点，选择器函数必须包含大量 if/else/else if 或 switch case 语句，以便处理所有不同的选择器。示例：
function select( selector ) {
if(selector.indexOf('.') > 0) //this might be a css class
return document.getElementsByClassName(selector);
else if(selector.indexOf('#') > 0) // this might be an id
return document.getElementById(selector);
else //this might be a tag name
return document.getElementsByTagName(selector);
//this is not taking all the different cases into account, but you get the idea.
};
【讨论】：
不，没有内置的方式。本质上，如果您决定不使用 jQuery，您将在代码中复制它的错误版本。
【讨论】：