jQuery遍历之向下遍历
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遍历之向下遍历的更多相关文章
- jQuery -> 基于当前元素的遍历
版权声明:本文为博主原创文章,转载请注明出处 https://blog.csdn.net/FeeLang/article/details/26257549 假设我们已经通过jQuery方法选中了一组元 ...
- linux下遍历目录
遍历目录的主要思想 由于目录就是一颗树,所以遍历目录就转换为遍历一棵树.谈到树的遍历就再熟悉不过了,有树的前序.层次和后序遍历,我使用的是前序遍历,后序遍历和前序遍历本质上一样,而层次遍历要比前两个麻 ...
- C#遍历文件夹下所有文件
FolderForm.cs的代码如下: using System; using System.Collections.Generic; using System.Diagnostics; using ...
- 在Linux下和Windows下遍历目录的方法及如何达成一致性操作
最近因为测试目的需要遍历一个目录下面的所有文件进行操作,主要是读每个文件的内容,只要知道文件名就OK了.在Java中直接用File类就可以搞定,因为Java中使用了组合模式,使得客户端对单个文件和文件 ...
- JAVA 遍历文件夹下的所有文件
JAVA 遍历文件夹下的所有文件(递归调用和非递归调用) 1.不使用递归的方法调用. public void traverseFolder1(String path) { int fileNum = ...
- linux下遍历目录(转-在于思考)
遍历目录的主要思想 由于目录就是一颗树,所以遍历目录就转换为遍历一棵树.谈到树的遍历就再熟悉不过了,有树的前序.层次和后序遍历,我使用的是前序遍历,后序遍历和前序遍历本质上一样,而层次遍历要比前两个麻 ...
- Linux下遍历目录及文件,更改权限
Linux下遍历目录及文件,更改权限 引言: 我在Linux下搭建android时,将eclipse及sdk复制到/usr/下时,总会出现无法读,无法写写样的问题. 解决方案: 有两个方案: 一.将复 ...
- PHP遍历文件夹下的文件和获取到input name的值
<?php$dir = dirname(__FILE__); //要遍历的目录名字 ->当前文件所在的文件夹//$dir='D:\PHP\wamp\www\admin\hosts\admi ...
- python3.4下遍历文件目录,不需要再特殊处理中文编码
python3.4下遍历文件目录,不需要再特殊处理中文编码 直接使用os.walk来遍历中文目录. os.walk方法返回的是一个三元 tupple(dirpath, dirnames, filena ...
随机推荐
- ARC062F AtCoDeerくんとグラフ色塗り / Painting Graphs with AtCoDeer Burnside 引理
题目传送门 https://atcoder.jp/contests/arc062/tasks/arc062_d 题解 首先对整张图做 Tarjan 点双. 对于一个点双,如果是由一条边构成的,那么很显 ...
- 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 ...
- Vue.js----date与时间戳的转换(unixTime)Moment.js让日期处理变得更简单
当前日期格式化 let curTime = moment().format('YYYY-MM-DD HH:mm:ss') console.log('当前日期时间curTime:' + curTime) ...
- QT中视图(setViewport)和窗口(setWindow) 小总结
参考博客: https://blog.csdn.net/weixin_39583140/article/details/92798127 https://blog.csdn.net/u01244271 ...
- Monkey命令及调试
monkey命令: 执行50w次,随机数200,忽略crash,忽略超时,详细信息级别为1:monkey -p 包名 -s 200 --throttle 100 --ignore-crashes -- ...
- CodeForces - 1051D (线性DP)
题目:https://codeforces.com/problemset/problem/1051/D 题意:一个2行n列的矩形,上面有黑白块,然后问你怎么布置才能有k个连通块,问有多少种方案数 思路 ...
- JQUERY的$(function(){})和window.onload=function(){}的区别【转】
在Jquery里面,我们知道入口函数有两种写法:$(function(){}) 和$(document).ready(function(){}) 作用类似于传统JavaScript中的window.o ...
- 【ngx-ueditor】百度编辑器按下Shift键不触发contentChange事件
背景:基于Angular 6,引入ngx-ueditor 发现现象:如果以Shift键+任意键结尾,则ngModel会丢失包含shift键的字符 例如:输入“ABC+AB++++”,则ngModel中 ...
- [MAC]配置Jenkins 开机自启动
如果是将jenkins.war放在tomcat中运行的, 则可以配置开机启动tomcat,脚本如下: XXX表示是你安装Tomcat所在目录 #启动tomcat cd XXX/Tomcat8/bin ...
- 在php中定义常量时,const和define的区别?
使用const使得代码简单易读,const本身就是一个语言结构,而define是一个函数.另外const在编译时要比define快很多. 1.const用于类成员变量的定义,一经定义,不可修改.Def ...