元素
表单对象属性过滤
选择器
描述
返回
示例
:
enabled
选取所有可用元素
集合元素
$（"#form1:
enabled"）;选取id为“form1”的表单内的所有可用元素
:
disabled
选取所有不可用元素
集合元素
$（"#form2:
disabled"）选取id为“form2”的表单内的所有不可用元素
:
checked
选取所有被选中的元素（单选框，复选框）
集合元素
$（"input:
checked"）;选取所有被选中的元素
:
selected
选取所有被选中的选项元素（下拉列表）
集合元素
$（"select:
selected"）;选取所有被选中的选项元素
在jQuery中，提供了attr（）方法来获取和设置元素属性，用removeAttr（）方法来删除元素属性。
1.获取属性和设置属性
例如要获取
元素的属性title，那么只需要给attr（）方法传递一个参数——你要获取的属性名称即可：
jQuery代码：
var$para=$（"p"）;//获取
节点
varp_txt=$para.attr（"title"）;//获取
元素节点属性title
如果想设置
元素的属性title的值，也可以使用同一个方法，不同的是，需要传递两个参数——属性名称和对应的值：
jQuery代码：
$（"p"）.attr（"title","yourtitle"）;//设置单个的属性值
如果需要一次性为同一个元素设置多个属性，可以使用下面的代码来实现：
$（"p"）.attr（{"title":
"yourtitle","name":
"test"}）;//将一个“名/值”形式的对象设置为匹配元素的属性。
注：
jQuery中的很多方法都是同一函数实现获取（getter）和设置（setter），比如上面的attr（）方法，它既能设置元素的属性的值，也能获取元素的属性的值。
另外，类似的方法还有html（）、text（）、height（）、width（）、val（）和css（）等方法。
2.删除属性
在某些情况下，需要删除文档中某个元素的特定属性，那么可以使用removeAttr（）方法来完成这一任务。
例子中，如果需要删除
元素的title属性，可以使用下面的代码实现：
$（"p"）.removeAttr（"title"）;//删除
元素的属性title
运行代码后，
元素的title属性被删除。
此时，
元素的HTML结构由：
你最喜欢的水果是?
变为：
你最喜欢的水果是?
1.html（）
此方法类似JavaScript中的innerHTML属性，它可以用来读取或设置某个元素里的HTML内容。
为了能更加清楚的展示例子的效果，我们把
元素的HTML代码改成：
你最喜欢的水果是?
然后用html（）方法对
元素进行操作：
varp_html=$（"p"）.html（）;//获取
元素的HTML代码
alert（p_html）;//打印出
元素的HTML代码
运行代码后，如图3-26所示：
图3-26获取
元素的HTML代码
如果需要设置某元素的HTML代码，那么也可以使用这个方法，不过需要为它传递一个参数。
比如，要设置
元素的HTML代码，可以使用如下代码来完成：
$（"p"）.html（"你最喜欢的水果是?
"）;//设置
元素的HTML代码
注：
html（）方法可以用于XHTML文档，但不能用于XML文档。
2.text（）
此方法类似JavaScript中的innerText属性，它可以用来读取或设置某个元素里的文本内容。
继续使用刚才的HTML代码：
你最喜欢的水果是?
用text（）方法对
元素进行操作：
varp_text=$（"p"）.text（）;//获取
元素的文本内容
alert（p_text）;//打印出
元素的文本内容
运行代码后，如图3-27所示：
图3-27获取
元素的文本内容
同html（）方法一样，如果需要为某元素设置文本内容，那么也要传递一个参数。
给
元素设置文本内容：
$（"p"）.text（"你最喜欢的水果是?
"）;//设置
元素的文本内容
注：
（1）JavaScript中的innerText属性并不能在Firefox下运行，而jQuery的text（）方法支持所有浏览器。
（2）text（）方法对HTML和XML文档都有效。
3.val（）
此方法类似JavaScript中的value属性，它可以用来设置和获取元素的值。
不管元素是文本框，下拉列表还是单选框，它都可以返回元素的值。
如果元素为多选，则返回一个包含所有选择的值的数组。
事件监听
执行时机
$（document）.ready（）和window.onload有类似的功能
在DOM加载完成时运行的代码，可以这样写：
jQuery代码:
$（document）.ready（function（）{
//在这里写你的代码...
}）;
在文档装载完成后，如果打算为元素绑定事件来完成某些事情，则可以使用bind（）方法来对匹配元素进行特定事件的绑定，bind（）方法的调用格式为：
bind（type[,data],fn）;
它有三个参数，第一个参数是事件类型，类型有：
“blur”、“focus”、“load”、“resize”、“scroll”、“unload”、“click”、“dblclick”、“mousedown”、“mouseup”、“mousemove”、“mouseover”、“mouseout”、“mouseenter”、“mouseleave”、“change”、“select”、“submit”、“keydown”、“keypress”、“keyup”和“error”等，当然也可以是自定义名称。
第二个参数是可选，作为event.data属性值传递给事件对象的额外数据对象。
第三个参数是绑定的处理函数。
注：
可以发现，jQuery中的事件绑定类型比普通的JavaScript事件绑定类型少了“on”。
例如：
鼠标单击事件jQuery对应的是“click”，而JavaScript中是onclick（）函数。
简写绑定事件
像click、mouseover和mouseout这类事件，在程序中经常会使用到，jQuery为此也提供了一套简写的方法。
简写方法和bind（）的使用类似，实现的效果也相同，唯一的区别是能够减少代码量。
例如，把上面的例子改成使用简写绑定事件的方式，代码如下：
$（function（）{
$（"#f_id"）.click（function（）{
$（this）.hide（）;
varte=$（“[name=’test’]:
check”）.val（）;
}）;
$（"#panelh5.head"）.mouseover（function（）{
$（this）.next（"div.content"）.show（）;
}）;
$（"#panelh5.head"）.mouseout（function（）{
$（this）.next（"div.content"）.hide（）;
}）
}）;
注：
使用简写事件要注意，jQuery只对常用的事件进行了简化，有些事件并未做处理。
读者会发现有的事件用bind（）可以绑定事件，而用简写方式就不可以。
例如mouseenter和mouseleave。
合成事件
jQuery有两个合成事件——hover（）和toggle（），它们类似前面说过的ready（）方法，都属于jQuery自定义的方法。
hover（）方法
hover（）方法的语法结构为：
hover（over,out）;
它用于模仿鼠标悬停事件，当鼠标移动到元素上时，会触发指定的第一个函数（over）；当鼠标移出这个元素时，会触发指定的第二个函数（out）。
将上面的例子改成用hover（）方法，jQuery代码为：
$（function（）{
$（"#panelh5.head"）.hover（function（）{
$（this）.next（"div.content"）.show（）;
},function（）{
$（this）.next（"div.content"）.hide（）;
}）
}）;
代码运行后的效果跟下面代码的效果是一样的。
当鼠标滑过新闻标题后，它下面的新闻内容将被显示；当鼠标滑出新闻标题后，相应的新闻内容则被隐藏。
$（function（）{
$（"#panelh5.head"）.mouseover（function（）{
$（this）.next（"div.content"）.show（）;
}）;
$（"#panelh5.head"）.mouseout（function（）{
$（this）.next（"div.content"）.hide（）;
}）
}）;
toggle（）方法
toggle（）方法的语法结构为：
toggle（fn1,fn2,......fnN）;
它用于模仿鼠标连续点击事件，当第一次点击元素，则触发指定的第一个函数（fn1），当再次点击同一元素时，则触发指定的第二个函数（fn2），如果有更多函数，则依次触发，直到最后一个。
随后的每次点击都重复对这几个函数的轮番调用。
$（新闻标题）.toggle（function（）{
//新闻内容显示
},function（）{
//新闻内容隐藏
}）;
动画
show（）和hide（）
show（）和hide（）是jQuery中最基本的动画。
在HTML文档里，为一个元素调用hide（）方法，会将该元素的display样式改为“none”。
比如，使用如下代码隐藏element元素：
$（“element”）.hide（）;//通过.hide（）,隐藏元素
这段代码的功能跟用css（）方法设置display属性效果相同：
element.css（“display”,”none”）;//通过.css（）,隐藏元素
当把元素隐藏后，可以使用show（）方法将元素的display样式设置为先前的显示状态（“block”或“inline”）：
jQuery代码：
$（“element”）.show（）;
fadeIn（）和fadeOut（）
同show（）方法不一样的是，fadeIn（）和fadeOut（）方法只改变元素的不透明度。
fadeOut（）方法会在指定的一段时间内降低元素的不透明度，直到元素完全消失（“display:
none”）。
fadeIn（）方法则相反。
在上个例子中，如果只想改变“新闻内容”的不透明度，而不想改变高度和宽度，就可以使用fad