当前位置:  编程技术>WEB前端

Jquery节点遍历next与nextAll方法使用示例

    来源: 互联网  发布时间:2014-08-25

    本文导语:  Jqeruy节点遍历 //节点遍历 /*--next()方法用于获取“节点之后”挨着它的第一个“同类同辈”元素--*/ $(function () { /* $("div").click(function () { alert($(this).next("div").text()) //效果:当单击AA的时候会弹出BB,当点击B...

Jqeruy节点遍历

 
 
 
 
 
 
//节点遍历 

/*--next()方法用于获取“节点之后”挨着它的第一个“同类同辈”元素--*/ 
$(function () { 
/* 
$("div").click(function () { 
alert($(this).next("div").text()) //效果:当单击AA的时候会弹出BB,当点击BB的时候会弹出CC,当点击CC的时候会弹出空的警告框(因为CC这个div节点后挨着它的是p元素,所以就弹出一个空的警告框),当点击FF的时候会弹出KK,当点击KK的时候会弹出空的警告框,(因为KK这个div节点后没有同辈的div元素挨着它了,所以就弹出一个空的警告框) 
*/ 

/*--nextAll()方法用于获取“节点之后”所有的元素--*/ 
/* 
$("div,p").click(function () { 
alert($(this).nextAll().text()); //当单击div标签或者p标签的时候弹出点击的当前标签后的所有标签的text(); 
}) 
*/ 

/* 
$("div,p").click(function () { 
alert($(this).nextAll("p").text()); //当单击div标签或者p标签的时候弹出点击的当前标签后的所有p标签的text(); 
}) 
*/ 

/* 
$("div").click(function () { 
$(this).nextAll("div").css("background", "red"); //当点击div标签的时候将它后面的所有div标签的背景都设为红色 
}) 
*/ 

/* 
$("div").click(function () { 
$.each($(this).nextAll("div"), function () { $(this).css("background-color", "red") })//当点击div标签的时候将它后面的所有div标签的背景都设为红色,与上面的那一条效果是一样的(解释:先取得当前点击的div标签后面的所有div标签,然后对它进行遍历,然后通过后面的匿名函数将取得的所有div标签的背景设为红色)注意这前后两个this意思是不一样的:前面的this指的是当前点击的div标签,后面的thi是:在获取到当前点击的div标签的“后面的div标签”后,遍历他们的每一个div,后面的thi是:在后面的匿名函数正在处理的“当前遍历到的div标签” 【前面的是当前点击的div,后面的匿名函数的真正处理的当前div】 
}) 
*/ 


$("div,p").click(function () { 
//$(this).css("background", "red"); $(this).siblings().css("background", "yellow"); //将当前点击的div或者P标签背景设为红色,其他的兄弟标签背景设为黄色 

$(this).css("background", "red").siblings().css("background", "yellow");//与上面一句等同 

}) 

}) 
 
 
 
AA
BB
CC

DD

EE

FF
KK


    
 
 

您可能感兴趣的文章:

  • jquery遍历筛选数组与遍历解析json对象
  • jQuery UI组件 jQuery UI iis7站长之家
  • jquery进行数组遍历如何跳出当前的each循环
  • jquery遍历checkbox的注意事项说明
  • jquery遍历checkbox简单示例
  • jquery遍历checkbox介绍
  • Jquery遍历Table表头(示例)
  • jQuery遍历Table应用示例
  • jQuery基于当前元素进行下一步的遍历
  • jquery遍历select元素的二种方法(实例)
  • jquery遍历select元素(实例讲解)
  • Jquery遍历checkbox获取选中项value值的方法
  • jquery中each遍历对象和数组示例
  • Jquery遍历修改url请求参数的代码详解
  • jQuery向上遍历DOM树之parents(),parent(),closest()之间的区别
  • Jquery遍历节点的实现代码
  • jquery遍历与修改url请求参数的方法
  • JQuery 节点遍历的例子
  • Jquery遍历节点的方法小集
  • Jquery 三层遍历与删除的代码示例
  • jQuery如何获取节点与子节点文本?
  • jquery 取子节点及当前节点属性值的方法
  • jquery 取子节点及当前节点属性值
  • jQuery获取节点和子节点文本的方法
  • jquery的父子兄弟节点查找示例代码
  • JQuery 删除节点的例子
  • Jquery节点操作的几点知识
  • jQuery循环判断点击某节点
  • jquery移动节点代码
  • jquery删除节点代码
  • 移动节点的jquery代码
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • jQuery定时器插件 jQuery Timers应用示例
  • jquery打开dialog的简单示例
  • jQuery animate方法定位页面具体位置(示例)
  • jQuery设置input type值示例
  • jquery弹窗代码示例
  • jquery获取第几个元素方法示例 jquery选择器
  • jquery动态添加option示例
  • Jquery定时器的简单示例
  • JQuery获取上传文件大小(示例)
  • Jquery在指定DIV加载HTML示例代码
  • jQuery获得内容和属性示例代码
  • jQuery的each终止或跳过示例代码
  • jQuery获得内容和属性方法及示例
  • jquery根据name属性查找示例
  • jQuery find与children方法示例
  • jQuery回车键绑定点击事件示例
  • jQuery 滚动示例插件 kinetic
  • jQuery设置CSS属性(示例)
  • jquery制作搜狐快站页面效果示例分享
  • jquery select 取值与赋值示例
  • 通过javascript库JQuery实现页面跳转功能代码
  • jQuery鼠标动画插件 jquery-ahover
  • jQuery概述,代码举例及最新版下载
  • jQuery向导插件 Jquery Wizard Plugin
  • Jquery操作html复选框checkbox:全选,全不选和反选
  • jQuery圆角插件 jQuery Corners
  • struts+spring+hibernate+jquery实现分页功能的几个基本类介绍(异步加载)
  • jQuery相册插件 jQuery.popeye
  • jQuery UI组件 jQuery UI
  • jQuery右键菜单插件 jQuery ContextMenu
  • jQuery分页插件 Pagination jQuery Plugin


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3