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. sqlplus连接oracle失败分析和解决

    背景: 多台Linux服务器需要安装Oracle客户端,实现和Oracle数据库连接做业务处理. 安装完第一台后,直接将安装的目录压缩并复制到其他几台机器上,启动sqlplus连接数据库时,一直提示输 ...

  2. Javascript闭包深入解析及实现方法

    1.什么是闭包 闭包,官方对闭包的解释是:一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分.闭包的特点:1. 作为一个函数变量的一个引用,当函数返回时 ...

  3. C和指针 第十二章 结构体 习题

    12.3 重新编写12.7,使用头和尾指针分别以一个单独的指针传递给函数,而不是作为一个节点的一部分 #include <stdio.h> #include <stdlib.h> ...

  4. webApi 数据绑定 获取

    直接上代码: <html> <head> <meta name="viewport" content="width=device-width ...

  5. SQLite返回码

    SQLite返回码 返回码含义 宏 值 含义 SQLITE_OK 0 返回成功 SQLITE_ERROR 1 SQL错误或数据库不存在 SQLITE_INTERNAL 2 SQLite内部逻辑错误 S ...

  6. php之获取程序源码的方法

    文件hello.php和index.php在同一目录 hello.php <?php class hello{ public function __construct() { echo 'hel ...

  7. js正则

    JS正则 test:判断字符串是否符合规定的正则 rep = /\d+/; rep.test("asdfoiklfasdf89asdfasdf") # true rep = /^\ ...

  8. css实现翻页效果

    如图,鼠标移动到图上,实现右上角翻页的效果,本例主要border边框的设置. 一.基本概念 <html> <head> <style> #demo{ width:0 ...

  9. 【DevOps】DevOps成功的八大炫酷工具

    为自动化和分析所设计的软件及服务正加速devops改革的步伐,本文为你盘点了Devops成功的八大炫酷工具 Devops凭借其连接弥合开发与运营团队的能力正在各个行业呈现席卷之势.开发人员和运营人员历 ...

  10. poj 3687(拓扑排序)

    http://poj.org/problem?id=3687 题意:有一些球他们都有各自的重量,而且每个球的重量都不相同,现在,要给这些球贴标签.如果这些球没有限定条件说是哪个比哪个轻的话,那么默认的 ...