<div class="box">
<div class="item">
<div class="out">
<div class="inside">
666
</div>
</div>
</div>
</div>
<script>
var one = $('.box').children().attr('class'); //item
var two = $('.box').children().find('.out').attr('class');//out
var three = $('.inside').parent().attr('class'); //out
var four = $('.inside').parents('.item').attr('class') //item
</script>

1.选择直接父子元素:

  $(e).parent();

$(e)children()

2.选择多级父子元素:

父:$(e).parents('.box');

子:$(e).children().find('.inside');

3.jquery 对象转 dom

  $(e).get(0);

jquery 选择多级父子元素的更多相关文章

  1. jQuery选择:子代元素与后代元素的区别

    (1)后代元素:html代码如下,那么在jquery选择时,$(".test img"),中间为空格,则是选取后代元素,img对于ul来说是孙子辈元素,中间隔了li元素,所以后代元 ...

  2. jquery选择器之子元素

    HTML代码: :first-child 匹配第一个子元素,每个父元素的第一个子元素 :last-child 匹配最后一个子元素,每个父元素的最后一个子元素 <!DOCTYPE html> ...

  3. jQuery选择器之子元素过滤选择器Demo

    测试代码: 07-子元素过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" & ...

  4. jQuery选择器之子元素选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  5. 深入学习jQuery选择器系列第二篇——过滤选择器之子元素选择器

    × 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 在上一篇中已经介绍过基础选择器和层级选择器,本文开始介绍过滤选择器.过滤选择器是jQuery选择器中最为庞大也是最为 ...

  6. JQUERY选择和操作DOM元素(利用正则表达式的方法匹配字符串中的一部分)

    JQUERY选择和操作DOM元素(利用正则表达式的方法匹配字符串中的一部分) 1.匹配属性的开头 $("[attributeName^='value']"); 2.匹配属性的结尾 ...

  7. jQuery选择元素的方法大全

    jQuery选择器其实是一个有些地方比较费解的,如果没有经过多次实验的话,很难得出它的每个操作符到底是干什么的,很容易出错,经过 我的多次测试,终于对一些比较难理解或容易出错的选择操作进行总结,既方便 ...

  8. jQuery——选择元素

    ###理解DOM jQuery最强大的特性之一就是能够简化在DOM中选择元素的任务.**DOM(文档对象模型)**充当了JavaScript与网页之间的接口,它以对象网络而非纯文本的形式来表现HTML ...

  9. jQuery选择器之元素选择器

    元素选择器:根据给定(html)标记名称选择所有的元素. 描述: $('element') 搜索指定元素标签名的所有节点,这是一个合集的操作.同样的也有原生方法getElementsByTagName ...

随机推荐

  1. python三种导入模块的方法和区别

    方法一: import modname 模块是指一个可以交互使用,或者从另一Python 程序访问的代码段.只要导入了一个模块,就可以引用它的任何公共的函数.类或属性.模块可以通过这种方法来 使用其它 ...

  2. Contacts源码分析(一、概述)

    代码版本: Contact code version: 4.4.2 一 打开Log开关:如if (Log.isLoggable(Constants.PERFORMANCE_TAG, Log.DEBUG ...

  3. Resource Management in View Controllers

    UIViewController生命周期 UIViewControl是IOS程序中的一个重要组成部分,扮演者一个大管家的身份,管理着程序中的众多视图,今天看看了官方文档并做了如下一些简单的记录: 何时 ...

  4. linux查看用户组所有成员

    1.grep 'user1' /etc/group //找出用户组的gid user1:x:1004://得出gid=1004 2. awk -F":" '{print $1&qu ...

  5. IP应用加速 – DCDN迈入全栈新篇章

    4月11日,第七届"亚太内容分发大会"暨CDN峰会国际论坛中,阿里云资深技术专家姚伟斌发布了DCDN子产品IP应用加速(IPA).IPA是基于阿里云CDN本身的资源优化,对传输层( ...

  6. 【NS2】用eclipse调试NS2(转载)

    相信很多喜欢Java的人对eclipse都情有独钟.NS2程序的调试,可以用打印命令调试,这样太繁琐.也可以用gdb调试,个人觉得上手比较困难.相信各位学习NS2的新手,在看代码的时候,很多的函数或者 ...

  7. 用select提取List元素自身序号

    var cs = currentCitys.Select((c, i) => new { id = c.CITY_ID, 序号 = (i + 1).ToString(), 城市类型 = c.IS ...

  8. 2019-7-20-win10-uwp-使用-msbuild-命令行编译-UWP-程序

    title author date CreateTime categories win10 uwp 使用 msbuild 命令行编译 UWP 程序 lindexi 2019-07-20 21:56:2 ...

  9. python while 循环结构

  10. qt 利用Qtimer 定时器实现定时消息发送

    为了实现给控制器按周期发送控制指令,利用qt中的Qtimer 实现消息的定时发送. 需要进行三步处理: 1.在mainwindow.h文件中对timerEvent进行声明 public virtual ...