(Via Planet Web 2.0 ) cssQuery()是来自IE7脚本界的 Dean Edwards的新JavaScript库,位于文档对象模型 (DOM)的顶部,并允许您使用CSS选择器语法获取对文档元素的引用。
DOM是一种强大,高效的API,用于读取,编写和修改HTML和XML文档。 与JavaScript一起使用,它是DHTML效果的基础。 但是男孩有时会需要很多代码。
考虑一下这个小片段,来自我们在SitePoint上使用的表排序脚本:
function sortables_init() {
// Find all tables with class sortable and make them sortable
if (!document.getElementsByTagName) return;
tbls = document.getElementsByTagName("table");
for (ti=0;ti<tbls.length;ti++) {
thisTbl = tbls[ti];
if (((' '+thisTbl.className+' ').indexOf("sortable") != -1) && (thisTbl.id)) {
ts_makeSortable(thisTbl);
}
}
}
这段代码非常好,但是实际上它所做的就是在应用了可排序类的每个表元素上调用ts_makeSortable函数。 使用cssQuery()的代码如下:
function sortables_init() {
// Find all tables with class sortable and make them sortable
tbls = cssQuery("table.sortable");
for (ti=0;ti<tbls.length;ti++) {
ts_makeSortable(tbls[ti]);
}
}
在典型的DHTML脚本中,这可以节省大量代码。 当然,由于必须使用纯JavaScript来解析和解释CSS选择器,因此您会放弃一些性能,但是由于很少有JavaScript应用程序使浏览器陷于瘫痪。
cssQuery()支持所有CSS1和CSS2选择器,以及许多CSS3选择器。 哎呀,这比大多数当前的Web浏览器要好-都是用纯JavaScript编写的!
更新: Simon Willison于2003年3月生产了一个类似的库getElementsBySelector() 。它不支持那么多的CSS选择器类型,但是它可能比您日常使用中需要的更多。 结果是它变轻了。
From: https://www.sitepoint.com/cssquery-query-the-dom-with-css-selectors/