CSS 选择符

$ 函数可以根据传入的 ID 取得元素，但对于结构复杂的页面，单传入一个 ID 难于精确取到相应的元素，myJSFrame 参考 CSS 2.0 选择符概念与 JQuery 框架中 CSS 选择符的引用形式，实现了自有的 CSS 选择符支持方式。支持大部分常见的 CSS 选择符。

由于符合 CSS 选择符的元素可能有多个，因此 $ 函数的返回值可能不止一个 DOM 元素，一般来说，其返回值是符合选择符的 DOM 元素组成的数组。但为保留并兼容 $ 函数的返回值类型，经典的 $(ID) 返回值仍为 DOM 元素，而 $(CSS Selectors) 返回值为元素数组。

$ 函数的 CSS 选择符功能够更方便、迅速、准确地找到页面元素。

目前 myJSFrame 已经支持的选择符有：

• 通配选择符
• 属性选择符
• 包含选择符
• ID 选择符
• 类选择符
• 选择符分组

不支持的通配符有：

• 子对象选择符
• 伪类及伪对象选择符

如果传入 $ 函数的参数中带有空格（两端的空格无效）、逗号或小数点都将被认作 CSS 选择符，空格是包含选择符，逗号是选择符分组，小数点是类选择符。除此之外，都被认作是元素 ID ，返回值是一个 DOM 元素。如果要获取页面中所有的 li 元素，$("li") 是错误的，因为 $ 函数会认为要获取 ID 为 li 的元素，正确的方法是 $("body li") 。

参数

通配选择符

获取某范围里的所有元素。通配符匹配到的元素范围广，取得的结果相对较大，效率略低，建议少用。

属性选择符

匹配元素的属性与其值都符合的元素。属性选择符的格式为：[属性名=属性值] 或者 [属性名!=属性值]。 属性选择符可以有多重，比如 input[type=text][className=username]。

包含选择符

一个选择符被另一选择符所包含。如 $("div a") 表示 div 元素中包含的 a 元素。

ID 选择符

根据ID属性匹配元素，$("id") 与 $("#id") 完全等效。返回类型都是 DOM 元素。$("body div #id") 是不必要的写法，其返回值是数组，但长度为 1。

类选择符

根据元素的类名查找元素。$("div.content") 表示查找页面中类名为 content 的元素。类选择符是属性选择符的特例，相当于 $("div[className=content]")，但不建议用属性选择符来查找类名，因为元素的类名可以有多个（类名间用空格分割）。

选择符分组

多个选择符组合在一起可以是一个复合选择符，多个复合选择符或多个单一选择符可以是多组选择符（用逗号分割）。如：$("div.content,a") 表示页面中所有类名为 content 的 div 元素与页面中所有的 a 元素组合在一起作返回值数组。

返回值

由 DOM 元素组成的一维数组。如果传入 $ 函数的选择符在页面中查找不到符合条件的元素，返回值为空数组（长度为0）。

示例

<div class="titleList" id="newsTitle">
     <ul class="list black">
            <li><a href="http://localhost/olympic.asp?id=2000">2000年悉尼奥运会</a></li>
            <li><a href="http://localhost/olympic.asp?id=1996">1996年亚特兰大奥运会</a></li>
     </ul>
     <ul class="list gray">
            <li><a href="http://localhost/olympic.asp?id=1992">1992巴塞罗那奥运会</a></li>
            <li><a href="http://localhost/olympic.asp?id=1988">1988汉城奥运会</a></li>
     </ul>
     <div class="info">
            <input type="checkbox" value="read" id="hasReadThsRule" />已阅读
            <input type="checkbox" id="suggest">我有更好的建议
            <input type="button" value="确定" />
     </div>
</div>