Jquery学习笔记：利用find和children方法获取后代元素

在很多场景下，需要根据一个已知的jquery对象，去查找其满足条件的后代节点。

这时可以利用 find函数和children来处理。

find和children函数都可有一个参数，常见的是一个字符串，其值就是选择器，含义同利用 $()函数来获取元素。

两者的区别是children函数只获取其满足条件的第一层子节点，而find函数则获取所有下级子节点。

下面我们举例说明：

<div id="mydiv"><p id="pid"></p><span class="aspan">hello</span><div><a id="aid"></a><span class="aspan">test</span></div>
</div>

js代码如下：
var obj = $("#mydiv");
//获取到obj元素下的 div标签下的样式为aspan下的元素
var child = obj.find("div .aspan");
alert(child.html());children方法
obj.children() 获取obj的第一层所有子节点
obj.children("span") 获取obj的第一层所有标签为span子节点
obj.children("a") 返回为空，因为a标签不是obj的直接子节点，这时应该用find方法

通过children方法获得是一个jquery对象，利用 get(index)和 [index]取得的是dom对象，可以利用 first方法获取其中包含的第一个dom对象对应的jquery对象。

可以看出，使用这两个函数，核心就是其输入参数，即编写相应的选择器.

注意，利用find方法，如果条件不存在没有匹配的元素，则返回的并非是null或undefined，可以通过 length属性为0是否匹配到。

转载于:https://www.cnblogs.com/51kata/p/5103562.html

Jquery学习笔记：利用find和children方法获取后代元素相关推荐

html添加删除元素属性,jQuery学习笔记——.attr()和.removeAttr()方法操作元素属性
今天主要和大家一起分享一下如何使用jQuery的jQuery就可以让我们轻松的读取,添加,更改或删除一个(或多个)元素中的任何属性,在jQuery中我们可以使用下面的方法来实现:.attr():jQu ...
jQuery学习笔记之DOM操作、事件绑定（2）
jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定源码地址: https ...
jQuery学习笔记（黑马课堂+补充）
JQuery学习笔记(自用) 1.DOM对象和jQuery对象 DOM对象:原生JS取到的对象 getElementsById() getElementsByTagName() 特点:只能调用Dom方 ...
jQuery学习笔记系列（一）——入口函数，jQuery对象和DOM对象，jQuery选择器、样式操作、效果（显示隐藏、滑入滑出、淡入淡出、自定义动画、停止动画队列）
day01 - jQuery 学习目标: 能够说出什么是 jQuery 能够说出 jQuery 的优点能够简单使用 jQuery 能够说出 DOM 对象和 jQuery 对象的区别能够写出常用的 ...
jQuery学习笔记（二）
jQuery学习笔记(二) 二.管理jQuery包装集 1.创建新的元素使用HTML DOM 创建元素 var select=document.createElement("select& ...
javaweb（03） jQuery学习笔记
javaweb(03) jQuery学习笔记 jQuery介绍什么是jQuery jQuery,顾名思义,也就是 JavaScript 和查询(Query),它就是辅助 JavaScript 开发的 ...
jQuery 学习笔记
jQuery学习ing jQuery初学入口函数 jQuery对象和DOM对象区别转换选择器 + 迭代基本选择器层级选择器隐式迭代筛选选择器链式编程修改样式 jQuery 效果显 ...
jQuery学习笔记之unbind()
jQuery学习笔记之.unbind() 本文目标 1 了解.unbind()的几种调用方式及其参数含义 2 了解通过函数名解绑事件 3 了解利用命名空间解绑事件学习资料官方描述文档: http: ...
【转载】jQuery学习笔记
jQuery学习笔记 1 基础 HTML :一个人的裸体,是一个人的物质基础,是一个结构. CSS :一个人的漂亮外衣,使一个人看起来不是那么原始,修饰了一个人. JavaScript :一个人的灵魂 ...

Jquery学习笔记：利用find和children方法获取后代元素

Jquery学习笔记：利用find和children方法获取后代元素相关推荐

最新文章

热门文章