jQuery_选择器之基础选择器(二)-【官方】百战程序员_IT在线教育培训机构


xxxxxxxxxx
<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            font-size: 14px;
        }
    </style>
    <script src="./js/jquery-3.6.0.min.js"></script>
</head>
<body>
    <ul class="topnav">
        <li>Item 1</li>
        <li>Item 2
            <ul>
                <li>child item 1</li>
                <li>child item 2</li>
                <li>child item 3</li>
            </ul>
        </li>
        <li>Item 3</li>
    </ul>
    <script>
        $(".topnav > li").css("border", "3px double red");
    </script>
</body>
</html>

后代元素选择器（"parent child"）

选择所有指定“parent”元素中指定的"child"的后代元素


xxxxxxxxxx
<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            font-size: 14px;
        }
    </style>
    <script src="./js/jquery-3.6.0.min.js"></script>
</head>
<body>
    <ul class="topnav">
        <li>Item 1</li>
        <li>Item 2
            <ul>
                <li>child item 1</li>
                <li>child item 2</li>
                <li>child item 3</li>
            </ul>
        </li>
        <li>Item 3</li>
    </ul>
    <script>
        $(".topnav li").css("border", "3px double red");
    </script>
</body>
</html>

实时效果反馈

1. 子选择器和后代选择器的区别下列描述错误的是：

A 子选择器选择所有“parent”元素中的"child"的直接子元素

B 后代选择器选择所有“parent”元素中的"child"的后代元素

C 子选择器与后代选择器一样，没有区别

D 子选择器与后代选择器选择的范围不同

答案

1=>C

jQuery_选择器之基础选择器(一) jQuery_选择器之属性选择器(一)

北京市昌平区回龙观镇南店村综合商业楼2楼226室