1. 1)后代元素:html代码如下,那么在jquery选择时,$(".test img"),中间为空格,则是选取后代元素,img对于ul来说是孙子辈元素,中间隔了li元素,所以后代元素是指ul标签内的孙子辈、曾孙辈及以上元素。
  2.  
  3. 2)子元素:html代码如下,那么在jquery选择时,$(".test>li"),中间为>大于号,则是选取子元素,li对于ul来说是儿子辈元素,所以子元素是指ul标签内儿子辈的元素。
  4.  
  5. <ul class='test'>
  6. <li>
  7. <img src='xxxx' />
  8. <img src='xxxx' />
  9. <img src='xxxx' />
  10. </li>
  11. <li>
  12. <img src='xxxx' />
  13. </li>
  14. </ul>

---------------------
原文:https://blog.csdn.net/qq_26291823/article/details/80592626

jQuery选择:子代元素与后代元素的区别的更多相关文章

  1. HTML&CSS基础-子元素和后代元素选择器

    HTML&CSS基础-子元素和后代元素选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html ...

  2. jQuery 选择具有特殊属性的元素

    如今有这样一种需求,须要选出全部有背景图片的元素. 这个问题有点棘手.我们无法使用选择表达式来完毕这个问题了. 使用jQuery的DOM过滤方法filter(),能够依据函数中表达的不论什么条件选择元 ...

  3. jQuery查找子元素与后代元素

    1. 子元素: $().children('选择器')  如选择type为file的子元素  $(this).children("input[type=file]") 或者 $(& ...

  4. jquery选择器之获取父级元素、同级元素、子元素

    一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 二.获取同级元素: 1.next([expr]): 获取指定元素的下一个同级元素 2.nextAll([expr]) ...

  5. JQuery中查找父元素,子元素,追加元素,插入元素和删除元素 及其他常用方法

    Jquery之所以强大,和其在获取对象时使用与css选择器兼容的语法有很大关系.而且它还兼容了CSS3的选择器,而且多出了不少. 所以jQuery的选择器也就变得很多很强大.就最基本的有以下四个: $ ...

  6. jQuery 获取父元素、子元素、同级元素

    详情:http://www.w3school.com.cn/jquery/jquery_traversing_ancestors.asp   parent() 方法返回被选元素的直接父元素.(常用) ...

  7. jQuery内容过滤选择器与子元素过滤选择器用法实例分析

    jQuery选择器内容过滤 一.:contains(text) 选择器::contains(text)描述:匹配包含给定文本的元素返回值:元素集合 示例: ? 1 2 $("div.mini ...

  8. Jquery遍历之获取子级元素、同级元素和父级元素

    Jquery遍历之获取子级元素.同级元素和父级元素 Jquery的遍历,其实就当前位置的元素相对于其他元素的位置的关系进行查找或选取HTML元素.以某项选择开始,并沿着这条线进行移动,或向上(父级). ...

  9. jquery选择器 之 获取父级元素,子元素,同级元素

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link href ...

随机推荐

  1. zzzphp V1.6.0 按照功能分析漏洞

    0 基础支撑功能 0.1 路由功能 0.2 模版解析 * zzzphp V1.6.0 的代码执行漏洞,模版解析功能的问题 程序解析模版时,将模版中的部分内容匹配出来直接传递给了eval,且没有经过过滤 ...

  2. 使用js拆分带参数的URL,将参数分离出来

    url中的内容www.XXXX.com?content=123; 一下为js内容,包装在一个init方法中. init(); function init(){ var theRequest = new ...

  3. axios时遇到的Request Method: OPTIONS

    前言 在请求axios 请求数据的时候,会出现options的,是因为请求是分为简单请求和复杂请求. 简单请求 满足下面两个条件的请求是简单请求: 请求方式是以下三种之一: HEAD GET POST ...

  4. Oracle之:Function :getdate()

    create or replace function getdate(sp_date varchar) return date is Result date; begin if LENGTH(sp_d ...

  5. 【Python之路】特别篇--生成器(constructor)、迭代器(iterator)、可迭代对象(iterable)

    生成器(constructor) 生成器函数在Python中与迭代器协议的概念联系在一起.包含yield语句的函数会被特地编译成生成器 !!! 当函数被调用时,他们返回一个生成器对象,这个对象支持迭代 ...

  6. codevs 1501 二叉树最大宽度和高度x

                         题目描述 Description 给出一个二叉树,输出它的最大宽度和高度. 输入描述 Input Description 第一行一个整数n. 下面n行每行有两 ...

  7. head命令:显示文件开头内容

    head 命令可以显示指定文件前若干行的文件内容,其基本格式如下:head [选项] 文件名 选项: 选项 含义 -n K 这里的 K 表示行数,该选项用来显示文件前 K 行的内容:如果使用 &quo ...

  8. angularJS <input type="file> 图片的base64编码

    talk is cheap show me the code <input type="file" id="file" name="file&q ...

  9. JIRA绑定邮箱

    [管理-系统-外发邮件] 之前配置QQ邮箱没有成功,后来使用阿里邮箱一次就成功了 [保存]成功后可以测试一下

  10. $\LaTeX$数学公式大全12

    $12\ Font\ sizes$ ${\displaystyle \int f^{-1}(x-x_a)\,dx}$ {\displaystyle \int f^{-1}(x-x_a)\,dx} ${ ...