jquery中的过滤选择器:

1.通过标签的内容来进行过滤

:contains(’内容关键字‘)

例:

$("input").click(function () {

$("p:contains('JJJ')").css("background", "red");

});

2.可见性选择器:

依赖于元素是否可见作为筛选的条件

:hidden 过滤出不可见的元素
:visible 过滤出可见的元素

举例:

1. <p style="display:none">hhh</p> //隐藏
2.
$("input").click(function () {

alert( $("p:hidden('hhh')").text());

});

3.循环遍历的方法

jquery对象.each(function(){

//函数体

});

//注意:
visibility:hidden这种隐藏方式通过:hidden无法过滤的00
opacity 0:透明度为0 不是隐藏

3.属性过滤选择器:
语法:$("基本选择器[属性名]") 过滤出制定属性的元素
$(基本选择器["属性名=属性值"]过滤出保函制定属性并且属性值为制定的值元素

$("input").click(function () {

$("p[title]").each(function () {

alert($(this).text());

});

jquery中提供与选择器相关的一些筛选方法:

链式操作:jquery操作的一个特色
这些方法返回的是选择到的jquery对象的方法

$("p[title=aaa]").each(function () {

alert($(this).css("background","red").css("color","blue"));

});
方法:
first()选中第一个元素//left();

$("input").click(function () {

$("p").first().css("background", "red");

});

//注意:过滤方法主要用于链式操作(提高性能)//链式操作的好处
end()结束当前链式操作并放回前面选择到的jquery对象

例:

$("input").click(function () {

$("p").first().css("background", "red").end;

});

1.last()/eq(index)//传入参数 等价于:eq(index)
2.fillter(":过滤选择器")

$("p").filter(":even").css("background", "red").end;//通过偶数进行过滤

3.not("基本选择器/过滤选择器")方法相当于:not()

例子:将单元格分成不同的颜色

$("input").click(function () {

$("#zz tr").filter(":even").css("background", "red").end().filter(":odd").css("background",

"blue");

});

3 根据元素之间的层次关系进行DOM筛选:
1.对象.children() 获取当前对象的所有子元素
不包括文本节点和空的文本节点
一般规律:只要是用来选择多个元素的方法都可以传入参数
2.对象.parent();直接选择上一级的元素
//jq写入选择器的时候别忘了写#或者.还有在写按钮的时要input
parent("参数") 选择所有的父元素
3.兄弟元素的选择方法:
next() 返回紧临当前对象的下一个兄弟元素
nextAll() 获取对象后所有兄弟元素
prev() 返回紧临上一个兄弟元素
prevAll()返回所有的兄弟元素
siblings()返回所有的对象元素除了当前对象自己本身

例:
<div>

我是大盒子
<div id="xz">

我是小盒子
<p>W</p>
<p>j</p>

</div>
</div>

<input type="button" value="测试" />
<script type="text/javascript">
var divd = $("#xz");
alert( divd.children().length);

jquer基础篇二的更多相关文章

  1. php基础篇-二维数组排序 array_multisort

    原文:php基础篇-二维数组排序 array_multisort 对2维数组或者多维数组排序是常见的问题,在php中我们有个专门的多维数组排序函数,下面简单介绍下: array_multisort(a ...

  2. JavaScript笔记基础篇(二)

    基础篇主要是总结一些工作中遇到的技术问题是如何解决的,应为本人属于刚入行阶段技术并非大神如果笔记中有哪些错误,或者自己的一些想法希望大家多多交流互相学习. 1.ToFixed()函数 今天在做Birt ...

  3. Qt入门之基础篇 ( 二 ) :Qt项目建立、编译、运行和发布过程解析

    转载请注明出处:CN_Simo. 题解: 本篇内容主讲Qt应用从创建到发布的整个过程,旨在帮助读者能够快速走进Qt的世界. 本来计划是讲解Qt源码静态编译,如此的话读者可能并不能清楚地知道为何要静态编 ...

  4. NIO相关基础篇二

    转载请注明原创出处,谢谢! 上篇NIO相关基础篇一,主要介绍了一些基本的概念以及缓冲区(Buffer)和通道(Channel),本篇继续NIO相关话题内容,主要就是文件锁.以及比较关键的Selecto ...

  5. docker+k8s基础篇二

    Docker+K8s基础篇(二) docker的资源控制 A:docker的资源限制 Kubernetes的基础篇 A:DevOps的介绍 B:Kubernetes的架构概述 C:Kubernetes ...

  6. Python基础篇(二)_基本数据类型

    Python基础篇——基本数据类型 数字类型:整数类型.浮点数类型.复数类型 整数类型:4种进制表示形式:十进制.二进制.八进制.十六进制,默认采用十进制,其他进制需要增加引导符号 进制种类 引导符号 ...

  7. node基础篇二:模块、路由、全局变量课堂(持续)

    今天继续更新node基础篇,今天主要内容是模块.路由和全局变量. 模块这个概念,在很多语言中都有,现在模块开发已经成为了一种潮流,它能够帮助我们节省很多的时间,当然咱们的node自然也不能缺少,看下例 ...

  8. Hybrid APP基础篇(二)->Native、Hybrid、React Native、Web App方案的分析比较

    说明 Native.Hybrid.React.Web App方案的分析比较 目录 前言 参考来源 前置技术要求 楔子 几种APP开发模式 概述 Native App Web App Hybrid Ap ...

  9. C语言----输入输出语句(基础篇二)

    今天整理一下自己的基础篇输入和输出的理解,自己没有研究系统输入和输出函数,以后有时间在去深究,之前在别人的博客里面看到这么一句话分享给大家,“学习就是一个不断抄袭,模仿,练习和创新的一个过程”. 使用 ...

随机推荐

  1. PHP获取当前页面的URL

    /** * 获取当前页面完整URL地址 * * @author 52php.cnblogs.com */ function http_get_page_url() { global $_G; if ( ...

  2. MineCraft note

    客户端:http://pan.baidu.com/s/1hqgS8sshttp://pan.baidu.com/s/1mgmkduC 材质包:R3D小地图MODCraftGuide mod 内置合成表 ...

  3. mysql查询语句select-子查询

    1 子查询定义 在一个表表达中可以调用另一个表表达式,这个被调用的表表达式叫做子查询(subquery),我么也称作子选择(subselect)或内嵌选择(inner select).子查询的结果传递 ...

  4. Factory 模式

    在面向对象编程中, 最通常的方法是一个new操作符产生一个对象实例,new操作符就是用来构造对象实例的.但是在一些情况下, new操作符直接生成对象会带来一些问题.举例来说, 许多类型对象的创造需要一 ...

  5. (转)Intent flag 与启动模式的对应关系

    原文地址:http://www.cnblogs.com/ttylinux/p/4069513.html Activity有四种启动模式: 1.standard(标准)    2.singleTop   ...

  6. 进度条ProgressDialog

    1.效果图 public void click(View view) { final ProgressDialog pdDialog = new ProgressDialog(this); //设置标 ...

  7. 文本框value联动修改

    <input id="ipt-edit" value="" /><input id="ipt-target" value= ...

  8. stack.sh failing giving error "g-api did not start"

    same issue i faced , tried with ./unstack.sh and ./clean.sh also but couldn't fix the issue.Followin ...

  9. virtualbox之usb设备的分配

    来源:http://www.cnblogs.com/fsjohnhuang/p/3987545.html 首先下载安装virtualbox的扩展包,因为box原本不支持usb设备.www.virtua ...

  10. MediaElement.js之浏览器跨域请求视频播放

    浏览器跨域问题一直以来都是作为前端开发人员常见的问题,所以今天学习了下如何使浏览器跨域请求资源 需要了解的知识 -域(主域,子域,什么是跨域) 简单来说由于浏览器同源策略,凡是发送请求url的协议(h ...