`
othella
  • 浏览: 83191 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

jQuery类对象数组操作

阅读更多
我们都知道jQUery对象中有一个类数组的元素包装集,该集合类似js中的数组一样拥有length属性,因此我们称此为类数组,下面我们就来总结下这个jQuery对象中的类数组时如何进行操作的,看看我们的jQuery为我们都提供了哪些可用的方法:

  size():很明显,它应该是返回包装集中的元素个数,如$('a').size()表示链接元素的个数;

  get(index):当没指定index时就默认取包装集中所有元素,并以js中的数组形式返回,如果指定了index,则返回下标为 index对应的元素,如$('img[title]').get(0)返回包含属性title的第一个img元素,其也等效于$('img[title]')[0];

  index(elem):在包装集中返回元素elem所在的下标,如果没找到该元素则返回-1;

  add(String|elem|Array):把参数中的元素添加到包装集中,如果参数是jQuery选择器,那么将把所有匹配的对象都添加到集合中,如果是html元素那就通过clean方法得到的元素数组添加到集合中,如果是dom元素或dom元素数组,那就直接添加到集合了;注意返回的是添加后的包装集;如$('img[alt]','img[title]')等效于$('img[alt]').add('img[title]')即返回包含了alt属性的img元素或包含了title属性的img元素;

  not(String|elem|Array):把包装集中满足参数条件的元素删除,注意参数只能是筛选表达式,即以"["或者":"开头的表达式,如$('img[title]').not('title*=puy')即返回包含title属性的img元素,并且这些元素的title属性中包含有puy文本;返回的是筛选之后的包装集;

  filter(String|function):如果传入的参数是String类型的话,那么该表达式必须也是筛选表达式,用于从包装集里删除所有与选择器不匹配的元素;如果传入的是一个函数的话,那么包装集中的每个元素都调用这个函数,若这个函数返回false则把这个元素从包装集中删除,而在函数中可以通过this关键字来调用当时包装集中调用方法的元素;如$('td').filter(function(){return this.innerHTML.match(/^"d+$/)})返回td中的内容为数字的所有td元素;

  slice(begin,end):创建并返回新的包装集,该包装集是原来包装集的连续的一部分,且新包装集的第一个元素是原包装集中的 begin位置的元素,而最后一个元素是end位置元素的前一元素,当然end可以不指定,那么将延伸到原始包装集的末尾;如$('*').slice(2,3)这个语句选择页面上的所有元素,然后生存包含原始包装集的第三个元素的新包装集,注意这个$('*').get(2)不同,这个返回的是元素,而slice方法返回的是包装集,从而拥有包装集的操作;

  childen():返回原始包装集元素的所有不同子元素所组成的新包装集(不包含文本节点),如$('div').children()返回所有div元素下的子元素所组成的新包装集;如果指定了参数,那么该参数也是筛选表达式;

  contents():返回原始包装集元素的内容新包装集(可以包含文本节点);注意此方法不能接受参数进行过滤;

  next():返回原始包装集元素的所有唯一的下一个兄弟元素所组成的新包装集;如果指定了参数,那么该参数也是筛选表达式;如$('div#someDiv').next()返回包含id为someDiv的div元素的下一个兄弟元素的包装集;如果指定了参数,那么该参数也是筛选表达式;

  nextAll():返回包含原始包装集元素的所有后续兄弟的新包装集;如$('div#someDiv').nextAll()返回包含id为someDiv的div元素的后面兄弟元素的新包装集;如果指定了参数,那么该参数也是筛选表达式;

  parent():返回原始包装集所有元素的唯一直接父元素的新包装集;如果指定了参数,那么该参数也是筛选表达式;

  parents():返回原始包装集所有元素的祖先元素的新包装集;如果指定了参数,那么该参数也是筛选表达式;

  prev():返回原始包装集元素的所有唯一的上一个兄弟元素组成的新包装集;如果指定了参数,那么该参数也是筛选表达式;



  prevAll():返回包含原始包装集元素的所有前面兄弟元素的新包装集;如果指定了参数,那么该参数也是筛选表达式;

  siblings():返回包含原始包装集元素中的所有唯一兄弟元素所组成的新包装集;如果指定了参数,那么该参数也是筛选表达式;

  find(String):返回包含原始包装集里与传入的选择器表达式相匹配的所有元素的新包装集,并且原始包装集中的元素的后代也会被传入新的包装集;

  contains(text):返回包含text参数所传入的文本字符串的元素所组成的新包装集;

  is(String):如果包装集中含有String匹配的元素,那么返回true,否则返回false;

  clone(copyHandle):如果传入的参数为true,那么会连带事件一起拷贝,否则不拷贝事件,形成一个新的包装集;

  end():在jQuery命令链内调用,以便返回退到前一个包装集;

  andSelf():合并命令链内最近产生的两个包装集;
分享到:
评论
1 楼 llxhna 2012-05-31  
一美女一美女一美女一美女一美女

相关推荐

    JavaScript jQuery 中定义数组与操作及jquery数组操作

    JavaScript 和 jQuery 中的数组操作是编程中非常基础且重要的部分,尤其在处理数据集合时。在 JavaScript 中,数组是一种特殊的数据结构,可以存储各种类型的数据,包括整型、字符串、对象等。虽然 JavaScript 不...

    浅析jquery数组删除指定元素的方法:grep()

    `grep()`是jQuery中的一个函数,专门用于数组或类数组对象的过滤操作。它允许开发者定义一个函数,根据函数的返回值决定是否保留数组中的元素。`grep()`函数至少需要两个参数:第一个是要过滤的数组,第二个是过滤...

    jquery操作对象数组元素方法详解

    通过这些示例,我们能更好地理解如何正确操作jQuery对象数组,并避免常见的错误。 首先,我们来看一下错误的方法。错误方法的示例代码如下: ```javascript $(function(){ var div_span = $("#div1 span"); for...

    jquery的ajax传json对象数组到struts2的action

    本文将深入探讨如何使用jQuery的AJAX方法发送JSON对象数组到Struts2的Action,并在后端进行处理。 首先,我们了解JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于...

    利用jQuery操作对象数组的实现代码

    jQuery对于数组元素操作主要提供了以下工具: (1)数组和对象的例遍:jQuery.each(obj,callback) 通用例遍方法,可用于例遍对象和数组。回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或...

    jquery 向后台传 数组对象

    在这个场景中,我们特别关注的是如何使用jQuery传递数组对象到后台。下面我们将详细探讨这个主题。 1. **JSON对象与数组** 在JavaScript中,数组是存储一系列值的数据结构,而对象则是一组键值对。为了将数组或...

    jquery实现从数组移除指定的值

    grep方法是jQuery对象的一个方法,其基本语法如下: ```javascript var result = $.grep(array, function(index, value) { // 这里编写过滤逻辑 return true; // 返回true表示保留,返回false表示不保留 }); ``` ...

    jquerydom对象的事件隐藏显示和对象数组示例

    在本文中,我们将深入探讨jQuery的DOM对象事件处理、隐藏显示功能以及如何操作对象数组。jQuery作为一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互,使得Web开发更加便捷。 首先,让...

    JQuery使用index方法获取Jquery对象数组下标的方法

    本文将详细介绍如何使用JQuery的index方法来获取Jquery对象数组下标,并结合实例,展示index方法的使用技巧。 首先,我们要知道index方法通常有两种使用方式。第一种方式是不带参数,返回的是当前jQuery对象在同级...

    jQuery 对象中的类数组操作

    以上就是jQuery对象中一些核心的类数组操作方法,它们极大地增强了我们处理HTML元素集合的能力,简化了DOM操作。通过熟练掌握这些方法,开发者可以更高效地编写jQuery代码,实现复杂的网页交互功能。

    Jquery操作js数组及对象示例代码

    贴一段jQuery对js对象及数组的操作:增删改查的代码。 代码如下:var WorkList = new Array();//数组对象 //下面是自己定义的实体 function WorkEx(depart, title, begintime, endtime) { this.SId = 0; this.Id = -...

    SSH1,JQuery的ajax返回json二维数组处理过程

    这种格式表示一个数组,其中每个元素本身又是一个键值对的对象。在JavaScript中,可以方便地遍历和操作这些数据。 在JQuery中,我们可以使用AJAX的`$.ajax()`或简化的`$.get()`、`$.post()`方法来发送请求并处理...

    jQery中类数组判断的实现原理及代码实现

    在jQuery中,经常会遇到需要处理类似数组的对象,比如`jQuery对象`就是一个典型的类数组对象。本文将深入探讨jQuery中类数组判断的实现原理,并通过代码实现来帮助理解这一概念。 首先,我们要明确什么是类数组对象...

    jQuery中json对象的复制方式介绍(数组及对象)

    这里我们将深入探讨jQuery中两种主要的JSON对象复制方法,以及如何处理数组操作。 首先,我们来看jQuery自带的`$.map`方法。这个方法主要用于将数组或对象转化为新的数组。在描述中提到,使用`$.map`尝试复制JSON...

    Jquery中对数组的操作代码

    总结来说,jQuery的`$.map()`和`$.each()`提供了强大的数组和对象遍历能力,无论是处理传统的整数索引数组、键值对的JSON对象,还是jQuery对象数组,都能灵活应对。理解并熟练运用这两个方法,对于优化JavaScript...

    jquery中push()的用法(数组添加元素)

    首先,push()方法是JavaScript的原生方法,jQuery对其进行了封装,使其能够应用于jQuery对象。push()方法的用法和普通的JavaScript数组的push()方法相同,都允许开发者向一个数组的末尾添加一个或多个元素,并且该...

Global site tag (gtag.js) - Google Analytics