您的位置:首页 > Web前端 > JQuery

<<< Jquery查找元素、选择器使用方法总结

2014-07-02 14:10 791 查看
$("#myDiv");//根据给定的ID匹配一个元素,用于搜索id属性中给定的值,id属性必须是唯一的

$("div");//根据给定的元素名匹配所有元素,搜索指向dom节点的标签名


$(".myClass");//根据给定的类匹配元素,用以搜索的类。一个元素可以有多个类,只要有一个符合就能被匹配到

$("div,.myClass");//将每一个选择器匹配到的元素合并后一起返回,可以指定多个元素

返回示例:


<div>thisisdiv</div>
<pclass=".myClass">指定类</p>

结果:
<div>div</div>,<pclass=".myClass"></p>


$("forminput");或者
$("divinput");//在给定的父元素元素下匹配所有的子元素

$("div>input");//给定的父元素下匹配所有的子元素


<div>
<label>id</label>
<inputname="name"/>
<ul>
<li>Newsletter:</li>
</ul>
</div>
<inputname="none"/>

结果:
<inputname="name"/>


$('li:first')
;//获取li下面的第一个元素

[/code]
$('li:last');//获取li下面的最后一个元素

$("input:not(:checked)")或者$("div:not(a)");
//排除掉input所有选中的元素筛选,排除掉div下的所有a标签


$("li:even");//匹配所有索引值为偶数的元素,从0开始计数

例:


<ul>
<li>第一个</li>
<li>第二个</li>
<li>第三个</li>
<li>第四个</li>
</ul>
结果:
<li>第一个</li>,<li>第三个</li>


$("li:odd");//匹配所有索引值为奇数的元素,从0开始计数,与上面例子相反

$("li:eq(1)");//匹配给定索引值的元素,从0开始计数,拿上面例子,返回结果为<li>第二个</li>

$("li:gt(0)")和
$("li:lt(2)");//第一个查找所有大于给定索引值的元素,第二个所有小于给定索引值的元素

例:


<ul>
<li>第一个</li>
<li>第二个</li>
<li>第三个</li>
<li>第四个</li>
</ul>

第一个返回结果:
所有大于给定索引值的元素:<li>第二个</li>,<li>第三个</li>,<li>第四个</li>

第二个返回结果:
所有小于给定索引值的元素:<li>第一个</li>,<li>第二个</li>,<li>第三个</li>


$(".myClass").css("background","#EEE");//给类名myClass的所有元素加背景颜色

$("#myId:focus");//给id名为myId设置焦点

$("div:contains('sevennight')");//查找所有div下包含sevennight的元素

$("div:has(p)").addClass("test");给所有
包含p元素的div元素添加一个text类

$("td:parent");//查找所有含有子元素或者文本的td元素

$("div:hidden");//查找隐藏的div,或者type为hidden的元素

$("div:visible");//查找所有的可见div元素

$("input[name='myOption']").attr("checked",true);//查找input所有input标签name等于myOption的属性
checked为true的元素

$("input[name!='myOption']").attr("checked",true);//查找input所有input标签name不等于myOption的属性
[code]checked为true的元素[/code]
$("input[name^='seven']");//查找inputname以seven开始的元素,
<inputname="sevennight"/>,<inputname="sevenDay"/>

$("input[name$='day']");//查找inputname以day结尾的元素,与上面相反

$("input[name*='a']");//查找所有inputname包含a的元素

$("input['.myClass'][name$='over']");//查找class名为myClass的元素,并且此元素name以over结尾


$("input:checked");//查找所有选中的复选框,单选框

$("selectoption:selected");//查找option所有选中的选项元素
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: