html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jquery</title>
<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
//<script type="text/javascript" src="js/try.js" ></script>
<link rel="stylesheet" href="css/style.css" /> </head>
<body>
<div id="div1">div1
<div id="div2">div2
<p>
<a href="#">Hello</a>
</p>
</div>
</div>
</body>
</html>

  css

#div1 {
width:500px;
height:250px;
border:4px solid aquamarine; }
#div2 {
width:400px;
height:150px;
margin-left:10px ;
margin-top: 10px;
border:4px solid blue; }
p {
margin-left:10px ;
margin-top: 10px;
width:150px;
height:80px;
border:4px solid seagreen;
}

  效果:

向下遍历后:

添加js

1.使用

children()方法
$(document).ready(function(){
$("#div1").children().css({border:"4px solid black"}) });

效果:

2.使用find方法

js

$(document).ready(function(){
$("#div1").find("#div2").css({border:"4px solid black"}) });

  效果:

children() 方法和find()方法的区别

1.

$(document).ready(function(){
$("#div1").find("p").css({border:"4px solid black"}) });

  

2.

$(document).ready(function(){
$("#div1").children("p").css({border:"4px solid black"}) });

  效果:

children方法获得的仅仅是元素一下级的子元素,即:immediate children。 
find方法获得所有下级元素,即:descendants of these elements in the DOM tree 
children方法的参数selector 是可选的(optionally),用来过滤子元素,但find方法的参数selector方法是必选的。 

2017-09-21                  20:37:02

jQuery遍历之向下遍历的更多相关文章

  1. jQuery -> 基于当前元素的遍历

    版权声明:本文为博主原创文章,转载请注明出处 https://blog.csdn.net/FeeLang/article/details/26257549 假设我们已经通过jQuery方法选中了一组元 ...

  2. linux下遍历目录

    遍历目录的主要思想 由于目录就是一颗树,所以遍历目录就转换为遍历一棵树.谈到树的遍历就再熟悉不过了,有树的前序.层次和后序遍历,我使用的是前序遍历,后序遍历和前序遍历本质上一样,而层次遍历要比前两个麻 ...

  3. C#遍历文件夹下所有文件

    FolderForm.cs的代码如下: using System; using System.Collections.Generic; using System.Diagnostics; using ...

  4. 在Linux下和Windows下遍历目录的方法及如何达成一致性操作

    最近因为测试目的需要遍历一个目录下面的所有文件进行操作,主要是读每个文件的内容,只要知道文件名就OK了.在Java中直接用File类就可以搞定,因为Java中使用了组合模式,使得客户端对单个文件和文件 ...

  5. JAVA 遍历文件夹下的所有文件

    JAVA 遍历文件夹下的所有文件(递归调用和非递归调用) 1.不使用递归的方法调用. public void traverseFolder1(String path) { int fileNum = ...

  6. linux下遍历目录(转-在于思考)

    遍历目录的主要思想 由于目录就是一颗树,所以遍历目录就转换为遍历一棵树.谈到树的遍历就再熟悉不过了,有树的前序.层次和后序遍历,我使用的是前序遍历,后序遍历和前序遍历本质上一样,而层次遍历要比前两个麻 ...

  7. Linux下遍历目录及文件,更改权限

    Linux下遍历目录及文件,更改权限 引言: 我在Linux下搭建android时,将eclipse及sdk复制到/usr/下时,总会出现无法读,无法写写样的问题. 解决方案: 有两个方案: 一.将复 ...

  8. PHP遍历文件夹下的文件和获取到input name的值

    <?php$dir = dirname(__FILE__); //要遍历的目录名字 ->当前文件所在的文件夹//$dir='D:\PHP\wamp\www\admin\hosts\admi ...

  9. python3.4下遍历文件目录,不需要再特殊处理中文编码

    python3.4下遍历文件目录,不需要再特殊处理中文编码 直接使用os.walk来遍历中文目录. os.walk方法返回的是一个三元 tupple(dirpath, dirnames, filena ...

随机推荐

  1. ARC062F AtCoDeerくんとグラフ色塗り / Painting Graphs with AtCoDeer Burnside 引理

    题目传送门 https://atcoder.jp/contests/arc062/tasks/arc062_d 题解 首先对整张图做 Tarjan 点双. 对于一个点双,如果是由一条边构成的,那么很显 ...

  2. Kettle解析JSON错误,We MUST have the same number of values for all paths,We can not find and data with path [$.

    最近公司要从聚石塔上抽取数据,其中有JSON格式数据,所以学习一下Kettle解析JSON,碰到小小问题,记录一下: (1) 2015/07/15 15:22:48 - trade_detail.0 ...

  3. Vue.js----date与时间戳的转换(unixTime)Moment.js让日期处理变得更简单

    当前日期格式化 let curTime = moment().format('YYYY-MM-DD HH:mm:ss') console.log('当前日期时间curTime:' + curTime) ...

  4. QT中视图(setViewport)和窗口(setWindow) 小总结

    参考博客: https://blog.csdn.net/weixin_39583140/article/details/92798127 https://blog.csdn.net/u01244271 ...

  5. Monkey命令及调试

    monkey命令: 执行50w次,随机数200,忽略crash,忽略超时,详细信息级别为1:monkey -p 包名 -s 200 --throttle 100 --ignore-crashes -- ...

  6. CodeForces - 1051D (线性DP)

    题目:https://codeforces.com/problemset/problem/1051/D 题意:一个2行n列的矩形,上面有黑白块,然后问你怎么布置才能有k个连通块,问有多少种方案数 思路 ...

  7. JQUERY的$(function(){})和window.onload=function(){}的区别【转】

    在Jquery里面,我们知道入口函数有两种写法:$(function(){}) 和$(document).ready(function(){}) 作用类似于传统JavaScript中的window.o ...

  8. 【ngx-ueditor】百度编辑器按下Shift键不触发contentChange事件

    背景:基于Angular 6,引入ngx-ueditor 发现现象:如果以Shift键+任意键结尾,则ngModel会丢失包含shift键的字符 例如:输入“ABC+AB++++”,则ngModel中 ...

  9. [MAC]配置Jenkins 开机自启动

    如果是将jenkins.war放在tomcat中运行的, 则可以配置开机启动tomcat,脚本如下: XXX表示是你安装Tomcat所在目录 #启动tomcat cd XXX/Tomcat8/bin ...

  10. 在php中定义常量时,const和define的区别?

    使用const使得代码简单易读,const本身就是一个语言结构,而define是一个函数.另外const在编译时要比define快很多. 1.const用于类成员变量的定义,一经定义,不可修改.Def ...