jQuery 遍历函数包括了用于筛选、查找和串联元素的方法。本文主要介绍日常工作中常用的JQ遍历,
帮助一下初学者快速的接触遍历函数,提高自己的代码编写速度,写出更简洁更实用的代码,
祝前端的同学们,在前端这条没有尽头的路上渐行渐远。
如果有什么不对的地方 大家多提意见 互相学习 相互参考!!!
1.each()
 
语法:$(selector).each(function(index,element))
  实例:$('li').each(
    $(this).css(color,#c10000);
  )
  拆分一个数组,并为每个数组中的匹配元素,定义方法。
2.eq()
 语法:.eq(index) //index代表的是整数 最小为0 代表第一个对应元素
实例:$("#nav ul").find("li").eq(2).addClass("blod"); //找到id为nav 里面的ul里面的li 找到第3个li并为它加上一个.blod样式.
  
  通常找到的li 都是一个数组 eq() 方法是把其中你想要的那个单独提出来进行修改 样式增加

3.find()
  语法:.find(selector) //selector代表的是字符串值,包含供匹配当前元素集合的选择器表达式。
  实例:$("#nav ul").find("li").addClass("blod"); //找到id为nav 里面的ul里面的所有li并为它加上一个.blod样式.  
   方法获得当前元素集合中每个元素的后代,通过选择器、jQuery 对象或元素来筛选。
4.next(selector)
 语法:.next(selector)
//seLector代表的是字符串值,包含用于匹配元素的选择器表达式。
 实例:$("#nav ul").next("div") //找到id为nav 里面的ul 找到ul标签下面的第一个div标签
  
  next() 获得匹配元素集合中每个元素紧邻的同胞元素。如果提供选择器,则取回匹配该选择器的下一个同胞元素。
5.first()
 语法:.first()
 实例:$("#nav ul").first("li").addClass("blod"); //找到id为nav 下的ul下的li 找到第1个li并为它加上一个.blod样式.
  
  first() 将匹配元素集合缩减为集合中的第一个元素。

6.parent()

 语法:.parent(seletor) //seLector代表的是字符串值,包含用于匹配元素的选择器表达式。
 实例:$("#nav ul").parent("div").addClass("blod"); //找到id为nav 下的ul的父级元素div 为它加上一个.blod样式.  
  parent() 获得当前匹配元素集合中每个元素的父元素,使用选择器进行筛选是可选的。
7.parents()
 语法:.parents(seletor)
 实例:$("#nav ul").parents("div").addClass("blod"); //找到id为nav 下的ul的祖先元素div 为它加上一个.blod样式.
parents() 获得当前匹配元素集合中每个元素的祖先元素,使用选择器进行筛选是可选的。 8、siblings()   
 语法:.parents(seletor) 
 实例:$("#nav ul").first("li").siblings().addClass("blod"); //找到id为nav 下的ul的第一个li 为除了这个li以外的所有加上一个.blod样式.
  siblings() 获得匹配集合中每个元素的同胞,通过选择器进行筛选是可选的。
转载请注明出处~~ snper博客园

 

jQuery常用 遍历函数的更多相关文章

  1. js+jquery 常用选择器函数

    一.获取当前标签 JS: this,如下: <button onclick="fun(this)"></button> Jquery,如下: $(" ...

  2. jQuery常用操作方法及常用函数总结

    一篇 jQuery 常用方法及函数的文章留存备忘. jQuery 常见操作实现方式 $("标签名") //取html元素 document.getElementsByTagName ...

  3. jQuery中常用的函数方法

    jQuery中常用的函数方法总结 Ajax处理 load(url,[data],[callback]) url (String) : 待装入 HTML 网页网址. data (Map) : (可选) ...

  4. JQuery常用API 核心 效果 JQueryHTML 遍历 Event事件

    JQuery 常用API 参考资料:JQuery 官网   jQuery API 中文文档 核心 jQuery 对象 jQuery() 返回匹配的元素集合,无论是通过在DOM的基础上传递的参数还是创建 ...

  5. jQuery中常用的函数方法总结

    jQuery中为我们提供了很多有用的方法和属性,自己总结的一些常用的函数,方法.个人认为在开发中会比较常用的,仅供大家学习和参考. 事件处理 ready(fn) 代码: $(document).rea ...

  6. jquery 常用选择器和方法以及遍历(超详细)

    jQuery 常用选择器和和方法 学习总结 一.JQuery 介绍 1. 什么是 jQuery 2. jQuery 版本介绍 3. jQuery 文件介绍 二.jQuery 对象 1. jQuery ...

  7. jQuery中10个非常有用的遍历函数

    使用jQuery,可以 很容易的选择HTML元素.但有些时候,在HTML结构较为复杂时,提炼我们选择的元素就是一件麻烦的事情.在这篇教程中,我们将探讨十种方 法去精炼和扩展我们将要操作的集合. HTM ...

  8. jQuery 遍历函数

    转载http://www.cnblogs.com/tylerdonet/archive/2013/04/05/3000618.html jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函 ...

  9. jQuery 遍历函数(w3school)

    jQuery 遍历函数包括了用于筛选.查找和串联元素的方法.   函数 描述 .add() 将元素添加到匹配元素的集合中. .andSelf() 把堆栈中之前的元素集添加到当前集合中. .childr ...

随机推荐

  1. PyQt5——基本控件

    PyQt5基本控件使用方法详见:https://blog.csdn.net/jia666666/article/list/5?t=1& PyQt5基本控件汇总: 1.QMainWindow 2 ...

  2. 2018-2019-2 网络对抗技术 20165303 Exp6 信息搜集与漏洞扫描

    实践内容 (1)各种搜索技巧的应用 (2)DNS IP注册信息的查询 (3)基本的扫描技术:主机发现.端口扫描.OS及服务版本探测.具体服务的查点(以自己主机为目标) (4)漏洞扫描:会扫,会看报告, ...

  3. 如何解锁亚马逊A9的新算法?

    亚马逊每一次变动总能在跨境圈里掀起一场场风波,最近A9算法的更新更是牵动着不少卖家的心. A9算法是亚马逊运行的内核算法,只要消费者在亚马逊上面搜索了商品,那么他就已经开始使用了A9算法,通过分析每一 ...

  4. Python自学:第三章 使用方法sort( )对列表进行永久性排序

    cars = ["bmw", "audi", "toyota", "subaru"] cars.sort() print ...

  5. D - Dice Game (BFS)

    A dice is a small cube, with each side having a different number of spots on it, ranging from 1 to 6 ...

  6. C# 数组,对象实例化并赋值

    [数组] 数组实例化,并赋值时,可以省略new[]. ]; --未赋值 ,}; --赋值 [对象] 对象实例化,并赋值时,可以省略(). class test { public string name ...

  7. Cmake时 如何在windows命令行 选择vs版本

    本人电脑装了VS2017 和 VS2013版本.可能时VS2017安装的时间早,每次cmake文件时优先选择编译成VS2017的文件 可通过查看VS2013的版本,使用 cmake ../pcl-su ...

  8. .NET+MySql 踩坑1

    换成MySql数据库后,遇到的问题: 已解决,但不理解的问题: var test = db.test; 报如下图错误: 加上DefaultIfEmpty()则解决. var test = db.Tes ...

  9. Jenkins的安装配置和使用

    Jenkins的安装配置和使用 1 Jenkins介绍 w3cschool中这样介绍:Jenkins是一个独立的开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个 ...

  10. js 取整 取余

    1.取整//保留整数部分parseInt(3/2) // 1 2.向上取整// 向上取整,有小数就整数部分加1Math.ceil(3/2) // 2 3.四舍五入// 四舍五入Math.round(3 ...