WEB开发网
开发学院网页设计JavaScript jQuery 练习[二]: 获取对象(3) - 根据属性、内容匹... 阅读

jQuery 练习[二]: 获取对象(3) - 根据属性、内容匹配, 还有表单元素匹配

 2010-06-11 00:00:00 来源:WEB开发网   
核心提示: 查找空的 span: $("span:empty") <span>ABC</span><br/><span><b>ABC</b></span><br/><span>&l

查找空的 span: $("span:empty")

<span>ABC</span><br/>
<span><b>ABC</b></span><br/>
<span></span>
<div>
    <span>ABC</span><br/>
    <span><b>ABC</b></span><br/>
    <span></span>
</div>

查找非空的(也就是作为父元素的) span: $("span:parent")

<span>ABC</span><br/>
<span><b>ABC</b></span><br/>
<span></span>
<div>
    <span>ABC</span><br/>
    <span><b>ABC</b></span><br/>
    <span></span>
</div> 

:hidden 与 :visible 分别对应隐藏与显示的元素; 下例让已显示的变红, 让隐藏的显示为灰色.

<!doctype html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
</head>
<body>
    <div>111</div>
    <div>222</div>
    <div style="display:none">333</div>
    <div style="display:none">444</div>
</body>
</html>
<script>
    $("div:visible").css("color", "red");
    $("div:hidden").css("display", "").css("color", "silver");
</script> 

表单匹配:

:input 匹配:
    <input ... />
    <select></select>
    <textarea></textarea>
    <button></button>
:text        匹配 <input type="text" />
:password    匹配 <input type="password" />
:radio       匹配 <input type="radio" />
:checkbox    匹配 <input type="checkbox" />
:submit      匹配 <input type="submit" />
:reset       匹配 <input type="reset" />
:image       匹配 <input type="image" />
:file        匹配 <input type="" />
:button      匹配 <button></button>
:enabled     匹配 所有可用的 input 元素
:disabled    匹配 所有不可用的 input 元素
:checked     匹配 所有选中的被选中复选框、单选框
:selected    匹配 所有选中的 option 元素

编缉推荐阅读以下文章

  • jQuery 练习[二]: 获取对象(2) - 定位子对象
  • jQuery 练习[二]: 获取对象(1) - 基本选择与层级
  • jQuery 练习[一]: 准备工作

上一页  1 2 3 4 

Tags:jQuery 练习 获取

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接