Jquery学习笔记:利用parent和parents方法获取父节点
通过选择器一般只能获取指定标识的节点,或者获取子节点。
有些场景下,往往需要根据当前节点找到满足条件的父节点。这个可以通过相应的方法来实现。
1、parent方法
该方法可以获取元素的直接父节点。
我们还是通过例子来说明
<div>
<p id="pid"></p>
<span class="cspan"></span>
<div>
<a id="aid"></a>
<span>test</span>
</div>
</div>
js代码如下
var obj = $("#aid").parent(); //获取到的是aid元素的直接父节点div元素
alert(obj.html());
可以指定parent方法的参数,如 $("#aid").parent("div") 来检查父节点是否满足特定的条件。
2、parents方法
该方法可以获取元素所有上层节点(直到根节点)的集合。如:
<html>
<body>
<div class="mydiv">
<p id="pid"></p>
<span class="cspan"></span>
<div>
<a id="aid"></a>
<span>test</span>
</div>
</div>
</body>
</html>
js代码
var obj = $("#aid").parents(); //一共获得4个父节点,div>div>body>html
obj.each(function(index,data){
alert($(data).prop("tagName"));
});
可以通过给parents方法加参数来有条件的选择父节点。
如 $("#aid").parents("div") 只返回节点标签为DIV的 上层节点集合。
如 $("#aid").parents(".mydiv") 只返回节点包含样式mydiv 的 上层节点集合。
3、小结
通过上面两个方法,加上各种条件设置,可以获取到各种条件的上层节点。
Jquery学习笔记:利用parent和parents方法获取父节点的更多相关文章
- jQuery学习笔记---兄弟元素、子元素和父元素的获取
我们这里主要总结jQuery中对某元素的兄弟元素.子元素和父元素的获取,原声的Javascript代码对这些元素的获取比较麻烦一些,而jQuery正好对这些方法进行封装,让我们更加方便的对这些元素进行 ...
- jQuery通过parent()和parents()方法访问父级元素
<div class="inputGroup"> <p>2.您的最高学历是?</p> <label><input type=& ...
- jQuery学习笔记 - 基础知识扫盲入门篇
jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...
- jQuery学习笔记之插件开发(4)
jQuery学习笔记之插件开发(4) github源码地址 插件:了让原有功能的增强. 1.插件的种类(3种):局部.全局.选择器插件 1.1封装对象方法的插件 这种类型的插件是把一些常用或者重复使用 ...
- jQuery学习笔记之概念(1)
jQuery学习笔记之概念(1) ----------------------学习目录-------------------- 1.概念 2.特点 3.选择器 4.DOM操作 5.事件 6.jQuer ...
- 初步学习jquery学习笔记(五)
jquery学习笔记五 jquery遍历 什么是遍历? 从某个标签开始,按照某种规则移动,直到找到目标标签为止 标签树 <div> <ul> <li> <sp ...
- jQuery学习笔记(一)jQuery选择器
目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...
- jQuery 学习笔记
jQuery 学习笔记 一.jQuery概述 宗旨: Write Less, Do More. 基础知识: 1.符号$代替document.getElementById( ...
- jQuery学习笔记之Ajax用法详解
这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...
随机推荐
- [LeetCode]题解(python):014-Longest Common Prefix
题目来源: https://leetcode.com/problems/longest-common-prefix/ 题意分析: 这道题目是要写一个函数,找出字符串组strs的最长公共前缀子字符串. ...
- nginx启动
查看nginx的进程 ps -ef | grep nginx 重启nginx的3种办法1.service nginx restart2.改了配置文件让其生效办法 nginx -s reload3.到n ...
- 深入浅出—JAVA(10)
10.数字与静态 静态变量是共享的.同一类所有的实例共享一份静态变量. 实例变量:每个实例一个.静态变量:每个类一个. 数字的格式化 唯一必填的项目是类型 package xiao;class Sta ...
- MongoDB入门(1)--安装配置
第一步:下载安装 首先当然是找到官方网站http://www.mongodb.org/ 进入下载页面 可以看到,当前最新版本是2.4.5,我的电脑是64位的win7,所以要下载第一个(说明一下,第二个 ...
- QT学习 之 三维饼图绘制
QT里没有相应统计图形的绘制组件 只有手工自己画 效果如图 void aaq::paintEvent( QPaintEvent* ev ) { QPainter painter(this); // 去 ...
- lua学习:使用Lua处理游戏数据
在之前lua学习:lua作配置文件里,我们学会了用lua作配置文件. 其实lua在游戏开发中可以作为一个强大的保存.载入游戏数据的工具. 1.载入游戏数据 比如说,现在我有一份表单: data.xls ...
- cocos2dx进阶学习之CCDirector
继承关系 CCDirecotor -> CCObject, TypeInfo 处理主窗口消息,管理何时.何种方式执行场景. 经常被翻译成导演,负责管理整个游戏的进程推动和周边支持. 成员 inl ...
- Windows 8.1 RTM初体验
Windows 8.1正式发布在10月17日,现在可以在MSDN/TechNet进行订阅下载. 操作系统版本号和Windows Server 2012 R2保持一致. 开始屏幕动态磁贴现在有4种尺寸可 ...
- (step4.2.1) hdu 1372(Knight Moves——BFS)
解题思路:BFS 1)马的跳跃方向 在国际象棋的棋盘上,一匹马共有8个可能的跳跃方向,如图1所示,按顺时针分别记为1~8,设置一组坐标增量来描述这8个方向: 2)基本过程 设当前点(i,j),方向k, ...
- Data Structure(2)
在大体看过一遍<数据结构导论>的基础上完成了上一篇的博客,周五晚上通过上讲课,还是发现了一些问题的,主要体现在对第一章看的比较粗心,第一章的概论其实是对整本书的整体概况,这里没有多看上几遍 ...