在许多情况下,jquery代码所做的事情变成了:生成jquery对象A,操作对jquery象A;更改为jquery对象B,操作jquery对象B;更改为jqueryC,操作jquery对象C......;

jquery的链式操作:

链式操作概述:生成一个jquery对象后,既要对它进行一次或多次的普通操作,同时还要对它进行更改操作。于是有必要把生成jquery对象储存在一个变量中,满足多次调用的需要。

例如:

$(function(){
$("div").click(function(){
    $(this).addClass("highlight").children("ul").show().end()
    .siblings().removeClass("highlight").children("ul").hide();
  })
})

更改为后代元素的集合:

1.children()方法:是用来选择子元素的

  children("选择器");//选贼子元素中,所有匹配选择器的直接子元素

  children();选择父元素的所有直接子元素//并不是选中,是已经切换了

2.find()方法:是用来选择后代元素的

  find("选择器");//选择后代元素中,所有匹配选择器的后代元素

  find();//不选择原先元素任何后代元素//写不写都一样,什么都选不中

3.contents()方法:选择匹配元素文本块(节点)和子节点

    --说明:包括空文本节点

更改为祖先元素的集合:

1.parent()方法:选择父元素

  parent("选择器");//选择父元素中,所有匹配选择器的元素

  parent();//选择所有父元素

2.parents()方法:选择祖先元素

  parents("选择器");选择祖先元素中,所有匹配选择器的元素

  parents();//选择所有祖先元素

3.parentsUntil()方法:祖先元素

  parentUntil("选择器");//选择祖先元素,直到找到匹配选择器的元素,但不包括匹配元素

  parentUntil();//选择所有祖先元素

4.offsetParent()方法:选择最近的祖先定位元素,且该元素的css属性display不能为none;所谓定位元素是指其css属性的position取值为relitive、absolute、fixed。如果祖先元素中没有合适的元素,则会选择<html>根元素。

5.closest("选择器")方法:选择器本身和其他祖先元素所有匹配选择器的元素。也即是说,先看看原先的元素是否匹配,否则会一层一层地向上找到最先匹配祖先元素。

更改为兄弟元素的集合

1.next()和prev()方法

  next("选择器"),在原先元素后面的第一个兄弟元素中,选择匹配选择器的元素。next()或next("*"),会选取原先元素后面的第一个兄弟。

  prev("选择器"),在原先元素前面的第一个兄弟元素中,选择匹配选择器的元素。prev()或prev("*"),会选取原先元素前面的第一个兄弟。

2.nextAll()、prevAll()和siblings()方法

  nextAll("选择器"),在原先元素后面的兄弟元素中,选取匹配选择器的元素。nextAll()或nextAll("*"),会选取原先元素后面的所有兄弟。

  prevAll("选择器"),在原先元素前面的兄弟元素中,选取匹配选择器的元素。prevAll()或prevAll("*"),会选取原先元素前面的所有兄弟。

  siblings(“选择器”),在原先元素所有兄弟元素中,选取匹配选择器的元素。siblings()或siblings(“*”),会选取原先元素所有兄弟。

更改为更多元素的集合

1.add("选择器")方法,在原先元素的基础上添加选取匹配选择器的元素;

说明:$("选择器1").add("选择器2")选取的元素等同于$("选择器1","选择器2");相当于群组选择器;//给祖先元素用。

jquery筛选器


1.eq()、first()、last()方法

eq(index)、first()、last()

2.slice(start,[end])方法:筛选索引从start到(end-1)的元素

  slice(2,5)//2,3,4

3.filter("选择器")方法:选择匹配选择器的元素

4.not("选择器")方法:选择不匹配选择器的元素

5.has("选择器")方法:选择匹配选择器的后代元素

end()为切换为前一个对象。

javascript-jquery-更改jquery对象的更多相关文章

  1. Jquery第一篇【介绍Jquery、回顾JavaScript代码、JS对象与JQ对象的区别】

    什么是Jquery? Jquey就是一款跨主流浏览器的JavaScript库,简化JavaScript对HTML操作 就是封装了JavaScript,能够简化我们写代码的一个JavaScript库 为 ...

  2. 【JQuery】jquery对象和javascript对象即DOM对象相互转换

    jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象.jQuery 对象是 jQuery 独有的,其可以使用 jQuery 里的方法,但是不能使用 DOM 的方法:例如: $(&quo ...

  3. 在JavaScript中重写jQuery对象的方法

    jQuery是一个很好的类库,它给我们解决了很多的客户端编程,任何东西都不是万能的,当它不能满足我们的需求时我们需要对它进行重写,同时也不要影响其原有的功能或者修改其原有的功能:我现在的web应用程序 ...

  4. jQuery之Deferred对象详解

    deferred对象是jQuery对Promises接口的实现.它是非同步操作的通用接口,可以被看作是一个等待完成的任务,开发者通过一些通过的接口对其进行设置.事实上,它扮演代理人(proxy)的角色 ...

  5. 编写Javascript类库(jQuery版

    编写Javascript类库(jQuery版) - 进阶者系列 - 学习者系列文章 Posted on 2014-11-13 09:29 lzhdim 阅读(653) 评论(1) 编辑 收藏 本系列文 ...

  6. jQuery之Deferred对象P2

    转自 https://www.cnblogs.com/losesea/p/4415676.html deferred对象是jQuery对Promises接口的实现.它是非同步操作的通用接口,可以被看作 ...

  7. jQuery介绍 DOM对象和jQuery对象的转换与区别

    jQuery介绍 DOM对象和jQuery对象的转换与区别 jQuery介绍      jQuery: http://jquery.com/      write less, do more.   j ...

  8. 惊叹jQuery(解决jQuery对象到DOM的转换)

    jQuery是一个javascript框架,但绝对不是通常意义上的一些包装,个人感觉是一个改变js控制方式的框架.我们可以像美工通过写css分离页面代码一样,通过jQuery来分离页面与效果..下面转 ...

  9. jQuery的deferred对象详解(一)

    最近一段时间,都在研究jquery里面的$.Deffered对象,几天都搞不明白,其中源码的运行机制,网上查找了相关的资料,<jQuery的deferred对象详解>阮一峰老师的文章,里面 ...

  10. jquery 和 js 对象转换

    核心提示:jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,一般情况下,如S(’#id’ ...

随机推荐

  1. 自己写一个Map

    Map的实现其实很简单,一个key对应一个value就行 . 本Map是写着玩的,是想告诉初学者我们也可以写一个简单的Map来自己用 代码: public class MyMap<K, V> ...

  2. Linux下ansible使用

    一.ansible的功能和意义 1.功能 ansible批量功能 ----------------------> 并行 01. 可以实现批量系统操作配置 02. 可以实现批量软件服务部署 03. ...

  3. 浅析Is-a,Has-a与like-a

    在面向对象的设计领域里,有很多设计思路,主要有三种:is-a.has-a.like-a. 这三种在java的类.接口.抽象类中很多体现,下面简述一下其定义. 1.Is-a(继承关系) is-a,顾名思 ...

  4. Vue Abp vNext获取当前登录用户

    系统默认提供了获取当前用户的api方法 https://localhost:44364/api/identity/my-profile 手工实现方法:abp后台获取当前用户需要在AppService应 ...

  5. pyRevit开发:如何创建轴网

    必看部分: Document获取: 必看文章 如何添加基本项目引用 基础部分: 创建轴网 基本思路: 首先添加引用 获取当前项目文档 创建轴网定位线 创建轴网 设置轴网名称 实现代码: import ...

  6. 创建一个People类型,有年龄、工资、性别三个属性。 定义一个方法叫做找对象,找对象方法传过来一个人;

    创建一个People类型,有年龄.工资.性别三个属性. 定义一个方法叫做找对象,找对象方法传过来一个人: 首先如果性别相同,就输出"我不是同性恋", 如果对方是男的,年龄小于28, ...

  7. 珠峰2016,第9期 vue.js 笔记部份

    在珠峰参加培训好年了,笔记原是记在本子上,现在也经不需要看了,搬家不想带上书和本了,所以把笔记整理下,存在博客中,也顺便复习一下 安装vue.js 因为方便打包和环境依赖,所以建意npm  init  ...

  8. Elasticsearch(ES)分词器的那些事儿

    1. 概述 分词器是Elasticsearch中很重要的一个组件,用来将一段文本分析成一个一个的词,Elasticsearch再根据这些词去做倒排索引. 今天我们就来聊聊分词器的相关知识. 2. 内置 ...

  9. CDI Features inJavaEE 的上下文和依赖注入

    基本的CDI的功能: 类型安全:CDI使用Java类型来解析注入,而不是通过(字符串)名称注入对象.当类型不足时, 可以使用限定符 注释.这允许编译器轻松检测错误,并提供简单的重构. POJO:几乎每 ...

  10. linux停止进程

    $ kill -QUIT 主进程号 例如:kill -QUIT 1708 这种方式相对来说会有一个停止的过程,先将子进程停止掉,然后再停掉主进程. 快速停止Nginx: $ kill -TERM 主进 ...