jQuery层次选择器




DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>jQuery层次选择器title>
head>
<body>
<p>p>
<div id="father">
    <div>
        <span>span1span>
        <span>span2span>
        <span>span3span>
    div>
    <div>
        <b>1b>
        <div>div1div>
        <div>div2div>
        <div>div3div>
        <p>p>
    div>
    <div>div>
    <p>p>
    <p>p>
    <p>p>
    <span>sss1span>
div>
body>
html>
<script src="jquery-1.12.4.js">script>
<script>
    $(function () {
        //需求1:获取id为father这个元素的所有子div.
        //   console.log($('#father > div'));

        //需求2:获取id为father这个元素的所有子div以及所有子p.
        // console.log($('#father > div, p'));
        // console.log($('#father > div, #father > p'));


        //需求3:获取id为father这个div的所有后代div.
        // console.log($('#father div'));


        //需求4:获取id为father这个div的所有后代div,以及id为father这个div的所有后代span.
        //   console.log($('#father div, #father div span')); // 错误, 显示9个
        console.log($('#father div, #father span')); // 显示 10个

        /**
         * jQuery层级选择器
         * 子代选择器: $('ul > li')
         * 藕带选择器: $('ul li'); // 包括孙子
         */

    });
script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59

在这里插入图片描述

相关阅读:
[C++](15)继承
机器学习深入浅出
centos在docker中搭建靶场
数据结构与算法-常用排序算法
【C# 窗体超市购物买单系统】简单版和进阶版
linux上vscode中.cpp文件中引入头文件.hpp时报错：找不到头文件（启用错误钵形曲线）
JVM之【字节码/Class文件/ClassFile 内容解析】
leetCode热题100——两数之和（python）
c++ 沉思录——代理类
System.ArgumentException: 已添加了具有相同键的项

原文地址：https://blog.csdn.net/beyondx/article/details/126094893