XPath 是在XML 文档中识别不同元素或者元素值的一种语言，与CSS在HTml文档中识别元素的方式类似。

在涉及属性选择符是，jQuery使用了Xpath中的惯例来标识属性，即将属性前置一个@符号并放在一对方括号中，也就是说，Jquery没有采用CSS中不够灵活的属性选择符语法。例如 ，要选择所以带title属性的链接，可以使用下面代码 ：$('a[@title]')

此外，方括号在Xpath语法中还有另一中用途，即在不带前置@符号情况下，可以用来指定包含在另一个元素中的元素。例如， 我们可以通过下面的选择符表达式，取得包含一个ol元素的所有div元素：  $('div[ol]')

为连接添加样式

 

属性选择符允许以类似正则表达式的语法来标识字符串的开始（^）和结尾（$）。而且也可以使用（*）表示字符串中的任意位置。

下面我们看看Jquery为符合条件的链接添加3个类：mailto、pdflink和mysite。

alice.css

 1 .emphasized
 2    {
 3        font-style:italic;
 4        border:1px solid #888;
 5        padding:0.5em;
 6    }
 7    .horizontal
 8    {
 9        float:left;
10        list-style:none;
11        margin:10px;
12    }
13    
14    .sublevel
15    {
16        background-color:#ffc;
17    }
18    a
19    {
20        color:#00f;
21    }
22    a.mailto
23    { 
24        color:#f00;
25    }
26    a.pdflink
27    {
28        color:#090;
29    }
30    a.mysite
31    {
32        text-decoration:none;
33        border-bottom:1px dotted #00f;
34    }
35    

 

alice.js

 1$(document).ready(function() {
 2     $('#selectedplays>li').addClass('horizontal');//使用子元素组合符(>)将horizontal类只添加到位于顶级的项中。#selectedplays>li：查找在ID为selectedplays元素的子元素(>)中所有的列表项（li）
 3    $('#selectedplays>li:not(.horizontal)').addClass('sublevel');//与上相反
 4 
 5 
 6   $('a[@href^="mailto:"]').addClass('mailto');//取得所有电子邮件链接，用来寻找所有带href属性（[@href]）且以mailto开头（^="mailto:"）的锚
 7 
 8    $('a[@href$=".pdf"]').addClass('pdflink');//取得所有带href属性并以.pdf结尾的链接，必须是使用$
 9   $('a[@href*="mysite.com"]').addClass('mysite');//取得所有内部链接，必须使用*
10});

apsx

 

 1<ul id="selectedplays">
 2            <li>Comedies
 3                <ul>
 4                    <li><a href="http://www.mysite.com/asyoulikeit/">As You Like It</a></li>
 5                    <li>All's Well That Ends Well</li>
 6                    <li>A Midsummer Night's Dream</li>
 7                    <li>Twelfth Night</li>
 8                </ul>
 9            </li>
10            <li>Tragedies
11                <ul>
12                    <li><a href="hamlet.pdf">Hamlet</a></li>
13                    <li>Macbeth</li>
14                    <li>Romeo and Juliet</li>
15                </ul>
16            </li> 
17            <li>Histories
18                <ul>
19                    <li>Henry IV(<a href="mailto:henryiv@king.co.uk">email</a>)</li>
20                         <ul>
21                            <li>Part I</li>
22                            <li>Part II</li>
23                         </ul>
24                     <li><a href="http://www.shakespeare.co.uk/henryv.htm">Henry V</a></li>
25                     <li>Richard II</li>
26                </ul>
27            </li>
28        </ul>