jquery 节点遍历

<html>
<head>
<title></title>
<script src="Jquery/jquery-1.10.2.min.js" type="text/javascript"></script>
</head>
<body>
<div>AA</div>
<div>BB</div>
<div>CC</div> <p>DD</p>
<p>EE</p> <div>FF</div>
<div>KK</div>
</body>
</html>
<script type="text/javascript">
//节点遍历 /*--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");//与上面一句等同
})
})
</script>

Jquery节点遍历的更多相关文章

  1. jquery 源码解析 节点遍历

    jquery遍历,用于根据其相对于其他元素的关系来查找或选取html元素,以某项选择开始,并沿着这个选择移动,知道移动被称为对dom进行遍历 ☑ <div> 元素是 <ul> ...

  2. jQuery(九):节点遍历

    一.遍历子元素 children()方法可以用来获取元素的所有子元素,语法如下: 示例: <!DOCTYPE html> <html lang="en"> ...

  3. 第四章 jQuery节点操作

    1.DOM操作分为三类:(1)DOM Core:任何一种支持DOM的编程语言都可以使用用它如:getElementById()(2)HTML-DOM:用于处理HTML文档,如document,form ...

  4. 深入学习jQuery节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]删除节点[4]复制节点[5]替换节点[6]包裹节点 前面的话 DOM节点操作包括创建节点.插入节点.移除节点.替换节点和复制节点.jQuery也有类似的 ...

  5. jquery学习——遍历

    1.each() $(selector).each(function(index,element)) var arr = [ "a", "bb", " ...

  6. jquery $.each遍历json数组方法

    <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/ ...

  7. jQuery使用(十一):jQuery实例遍历与索引

    each() children() index() 一.jQuery实例遍历方法each() jQuery实例上的each()方法规定要运行的函数,并且给函数传入两个参数:index,element. ...

  8. JQuery each遍历A标签获取href 和 里面指定的值

    JQuery each遍历A标签获取href $('.scol_subject').each(function(){ var href = $(this).attr('href'); $(this). ...

  9. [osg]节点遍历nodevisitor浅析

    参考:https://www.cnblogs.com/hzhg/archive/2010/12/17/1908764.html OSG中节点的访问使用的是一种访问器模式.一个典型的访问器涉及抽象访问者 ...

随机推荐

  1. Mysql zip 安装(windows)

    Mysql Windows zip包安装 Mysql 下载地址: http://dev.mysql.com/downloads/mysql/ 下载windows 版本对应的zip,之后解压 在C:\P ...

  2. C#中一些易混知识的比较

     Equals 和==的区别         C#中有两种不同的相等:引用相等和值相等         ==是比较两个变量的值是否相同或两个引用是不是指向同一个内存地址.         Equals ...

  3. EasyUI - According 分类列表

    效果: html代码: <div id="aa" class="easyui-accordion" style="width: 300px; h ...

  4. Java与C#的语法区别(不断更新中...)

    1.static关键字: 在java中静态成员能够被对象和类名调用: 在C#中,静态成员只能被类调用不能被对象调用. 2.for循环: 在java中可以在for前面添加标记,然后在for循环中可以br ...

  5. VC++笔记七

    动态链接库修改文件名问题? eg:GetRadarFS.dll->RadarModel.dll; 注意修改:打开文件GetRadarFs.def 修改 LIBRARY  "GetRad ...

  6. spring Jdbc自己主动获取主键。

    学习了下springjdbc,感觉挺有用的,相对来说springjdbc 扩展性相当好了 package com.power.dao; import java.lang.reflect.Paramet ...

  7. Cocos2dx引擎10-事件派发

    本文介绍Cocos2dx事件(以下简称Event)处理机制中的事件分发模块,在Event发生后,进过一系列处理,最后将会分发Event: 1.dispatchEvent& dispatchTo ...

  8. Swift - 使用TableView的静态单元格进行页面布局

    通过使用静态单元格的列表,我们可以很方便的进行页面布局.下面通过一个“添加任务页面”来进行演示. 效果图如下: 实现步骤: 1,在storyboard中拖入一个TableViewController, ...

  9. 如何将自定义标签封装成一个Jar包

    当我们在一个web应用中开发好一些自定义标签的时候,这些自定义标签通常有标签处理器Java类,和一个描述这些标签tld文件,如果我们想在以后别的web工程中还能用上这些标签,可以将这些自定义标签封装在 ...

  10. appium 真机测试问题 出现 instruments crashed on startup

    1.appium 真机测试的时候 instruments crashed on startup,必须在真机上打开UI Automation 在设置里: Developer->Enable UI ...