dean.edwards.name/my/cssQuery/


cssQuery()

version 2.0.2

还在使用 getElementsByTagName? 哼~

简介

cssQuery() 是一款强大的 跨浏览器 JavaScript 脚本方法, 它能够利用“CSS 选择器”来 获取 DOM 文档。支持所有CSS1CSS2 以及部分 CSS3 选择器。

用法

语法

elements = cssQuery(selector [, from]);

其中 selector (必需的) 是一个有效的 CSS 选择器 ,而 from (可选的) 则是一个被 selector 筛选的文件、元素或队列。

方法为所需变量 (elements) 返回一个 JavaScript 队列。 如果没有与之匹配的, 则返回空队列。

下面是一些例子:

// find all paragraphs that are direct descendants
//  of the document body
var tags = cssQuery("body > p");

// find all elements with the "href" attribute
var tags = cssQuery("[href]");

// find all anchor elements with "href" equal to "#"
var tags = cssQuery("a[href='#']");
// find all images contained by the above anchors
var images = cssQuery("img", tags);

// find all lists
var tags = cssQuery("dl,ol,ul");

// query an external xml document
var tags = cssQuery("my|:root>my|link", myXMLDoc);

// just plain complicated
var complex = "p>a:first-child+input[type=text]~span";
var tags = cssQuery(complex);

支持的选择器

  • *
  • E
  • E F
  • E > F
  • E + F
  • E ~ F
  • E.warning
  • E#myid
  • E:link
  • E:first-child
  • E:last-child
  • E:nth-child(n)
  • E:nth-last-child(n)
  • E:only-child
  • E:root
  • E:lang(fr)
  • E:target
  • E:enabled
  • E:disabled
  • E:checked
  • E:contains("foo")
  • E:not(s)
  • E[foo]
  • E[foo="bar"]
  • E[foo~="bar"]
  • E[foo^="bar"]
  • E[foo$="bar"]
  • E[foo*="bar"]
  • E[foo|="bar"]

兼容性

已知可运行于以下平台:

  • Microsoft Internet Explorer 5+ (Windows)
  • Microsoft Internet Explorer 5.2 (Mac)
  • Firefox/Mozilla 1.6+
  • Opera 7+
  • Netscape 6+
  • Safari 1.2

源代码

下载

您可以在这里 下载 cssQuery. 压缩包中包含源代码和 测试页面