属性过滤选择器

下面将通过示例来讲解如何使用过滤选择器定位DOM元素的方法。

示例如下：

(1)描述

页面中，创建四个div标记，并设置不同的ID和Title属性值，然后通过属性过滤选择器获取所指定的元素集合，并显示在页面中。

(2)代码实现

...省略代码
<script type="text/javascript">
$(function(){ //显示所有包含id属性的元素 1
    $("div[id]").show(3000);
})
$(function(){ //显示所有属性title的值是"A"的元素  2
    $("div[title='A']").show(3000); 
})
$(function(){ //显示所有属性title的值不是"A"的元素  3
    $("div[title!='A']").show(3000); 
})
$(function(){ //显示所有属性title的值是"A"开始的元素  4
    $("div[title^='A']").show(3000); 
})
$(function(){ //显示所有属性title的值是"C"结束的元素  5
    $("div[title$='C']").show(3000); 
})
$(function(){ //显示所有属性title的值中含有"B"的元素  6
    $("div[title*='B']").show(3000); 
})
$(function(){ //显示所有属性title的值中含有"B"且属性id的值是“divAB”的元素   7
    $("div[id='divAB'][title*='B']").show(3000); 
})
</script>
...省略代码
<div id="divID">ID</div>
<div title="A">title A</div>
<div id="divAB" title="AB">ID
title AB</div>
<div title="ABC">title ABC</div>
...省略代码