jQuery学习笔记一:选择器

注:选择器中不要有空格,此处有空格是为了清楚显示。
html



$("sel1,sel2,sel3");

经过逗号,来定位多个元素。spa


$("div span");

层级选择器,经过空格 来定位多个元素,div是父元素,span表示后代元素,包括子元素和孙子元素。code


$("div > span");

子选择器,经过大于号>来定位父元素下的全部子元素,不包括孙子元素。orm


$("div + label");

紧邻选择器,经过加号+来定位div元素紧邻的下面的同辈label元素而且只获取第一个元素,若是紧邻的不是label元素,则此选择器无效。htm


$("div ~ label");

相似于上面的选择器,不一样的是,此选择器会得到紧邻的全部同辈选择器。只要是同辈的而且位于div下面的元素都会被定位。索引


$("li : first");         $("li : last");

过滤选择器,选择li元素中第一个元素 或者 最后一个元素。返回一个元素。图片


$("li : eq(2)");

过滤选择器,选择全部 li 元素中第三个 li 元素,索引位置从0开始。字符串


$("li : contains('博客')");

经过文本内容过滤,选择 li 元素中全部文本内容为 博客的。其中括号内必须加引号,由于传入的是字符串,不是变量。input


$("li : has(a)");

经过包含元素的名称来过滤,选择 li 元素中全部 <a>标签。博客


$("div : hidden");

获取所有不可见的元素,也包括input标签中type=hidden的元素。


$("li : visible");

跟上面的选择器相反,此选择器选择的是全部li元素中可见的(display!=none)的元素。


$("li [title = 标题]");

属性选择器,选择全部 li 元素中 属性title 等于 “标题”的。


$("li [title != 标题]");

属性选择器,选择全部 li 元素 中属性 不等于 “标题” 的。


$("li [title *= 标题]");

属性选择器,选择全部 li 元素中属性 包括 “标题” 的。


$("li : first-child");

选择每一个父元素中的首个元素。返回的是一个集合。


$("li : last-child");

选择每一个父元素中的最后一个元素。返回的是一个集合。


$("#test:input");

表单选择器,选择id为test的元素中全部的input标签,也包括button,textarea,和select。


$("#test:text");

表单选择器,选择id为test的元素中全部type等于text的单行文本输入元素。


$("#test:password");

表单选择器,选择id为test的元素中全部type等于password的表单密码框。



$("#test:radio");

表单选择器,选择id为test的元素中全部type等于radio的单选框。



$("#test:checkbox");

表单选择器,选择id为test的元素中全部type等于checkbox的多选框。



$("#test input:submit");

表单选择器,选择id为test的元素中input元素中type等于submit的提交按钮。



$("#test:image");

表单选择器,选择id为test的元素中input元素中type等于img的图片。对于<img>标签无效,只对<input type='image'>有效.



$("#test:button");

表单选择器,选择id为test的元素中button元素。对<input>和<button>有效.



$("#test:checked");

表单选择器,选择id为test的元素中单选和多选全部被选中的元素。




$("#test:selected");

表单选择器,选择id为test的元素中下拉菜单全部被选中的元素。

相关文章
相关标签/搜索