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

(2)子元素:html代码如下,那么在jquery选择时,$(".test>li"),中间为>大于号,则是选取子元素,li对于ul来说是儿子辈元素,所以子元素是指ul标签内儿子辈的元素。

<ul class='test'>
<li>
<img src='xxxx' />
<img src='xxxx' />
<img src='xxxx' />
</li>
<li>
<img src='xxxx' />
</li>
</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. IQ基础

      I: in-phase 表示同相Q: quadrature 表示正交,与I 相位差90 度. 现在来解释IQ信号的来源: 最早通讯是模拟通讯,假设载波为cos(a),信号为cos(b),那么通过相 ...

  2. Loadrunner:管理员权限启动报错“win10 为了对电脑进行保护,已经阻止此应用”

    问题 最近在尝试做性能测试,由于 Loadrunner 必须用管理员身份启动(普通用户权限启动会遇到各种权限不足的问题) 但是用管理员身份启动时,报错了:win10 为了对电脑进行保护,已经阻止此应用 ...

  3. js 深浅拷贝 笔记总结

    一.js 数据类型 javaScritp的数据类型有:数值类型.字符串类型.布尔类型.null.undefined.对象(数组.正则表达式.日期.函数),大致分成两种:基本数据类型和引用数据类型, 其 ...

  4. 去除IntelliJ IDEA中重复代码报灰黄色的下划波浪线

    最近写Java在用IntelliJ IDEA这款传说中的神器IDE,看群里的大神们都在用,也耐不住寂寞想向大神们看齐一下.刚开始用,很多地方也不是很熟,今天遇到一个问题,导入一个项目后,看有些类里的代 ...

  5. PHP类的设计模式

    单例模式 <?php class mysingle { private static $myinstance =null; private function __construct() { } ...

  6. nginx日志、变量

    日志格式类型等 包含两类:access_log  error.log log_format log只能在http模块下配置 下图是一个典型error_log配置 warn表示默认日志级别为‘’警告‘’ ...

  7. 天刀默认src截图保存文件夹位置在哪里?

    C:\Users\Public\Documents\WuXia 注意有的电脑显示的是public documents,实际进去就是documents

  8. 对webview的研究--------引用

    简要的说,webview能够在移动应用中开辟出一个窗口,在里面显示html页面,css以及js代码也可以被解析执行,它使用的是我们熟悉的webkit内核.android和ios都有相应的API,所以写 ...

  9. 51 Nod 1072 威佐夫游戏

    https://baike.baidu.com/item/%E5%A8%81%E4%BD%90%E5%A4%AB%E5%8D%9A%E5%BC%88/19858256?fr=aladdin&f ...

  10. 通过PCI9030向外部RAM写数据失败现象

    我们的系统方案是:以9030作为PCI接口芯片,本地端映射了一片IDT70V06的双端口RAM.进行数据传输压力测试时,发现PC机向IDT70V06写数据偶尔会失败.这一问题是什么原因造成的呢? 最初 ...