vue期末复习选择题1

1. 下面哪一项描述是错误的?(B)

  • A.$("ul li:gt(5):not(:last)")选取ul标记里面索引值大于5且不是最后一个的li元素
  • B.$("div").find("span")选取div元素的子元素span
  • C.$("div.showmore > a")选取class属性值为showmore的div元素的子元素a
  • D. $("ul li").filter(":contains('佳能'),:contains('尼康'),:contains('奥林巴斯')")选取文本包含佳能或尼康或奥林巴斯的li元素

[!NOTE]

代码 $("div").find("span") 实际上并不是选取 div 元素的子元素 span,而是选取 div 元素的后代元素中的 span 元素。

如果要选取 div 元素的直接子元素中的 span 元素,可以使用 $("div > span")。这样的选择器将选取所有直接作为 div 元素子元素的 span 元素。

2. 下面哪一项描述是错误的?(A)

  • A. $("div~span")选取<div>标记所有的同辈元素<span>
  • B. $("div>span")选取<div>标记里的标记名为<span>的子元素标记
  • C. $("#two>*")选取id属性值为two的标记的所有子元素
  • D. $(".one+span")选取class属性值为one的标记的向下紧相邻的同辈元素<span>

[!NOTE]

$("div~span") 并不是选取 <div>标记所有的同辈元素 <span>

$("div~span") 是一种 jQuery 选择器语法,用于选取所有与 div元素同级且在 div元素后面的所有兄弟元素中的 span 元素。

例如,考虑以下 HTML 结构:

<div></div>
<span></span>
<div></div>
<span></span>
<span></span>
<div></div>

在这个结构中,$("div~span") 会选取第二个和第四个 span 元素,因为它们是与 div 元素同级的,并且在 div 元素后面的所有兄弟元素中。

3. 有如下HTML结构代码:

<body>
    <h1>这是标题1</h1>
    <h2>这是标题2</h2>
    <div class="one" id="one">
        id为one,class为one的div
        <div class="mini">
            class为mini
        </div>
    </div>
    
    <div class="one" id="two" title="test">
        id为two,class为one,title为test的div
        <div class="mini" title="other">class为mini,title为other</div>
        <div class="mini" title="test">class为mini,title为test</div>
    </div>
    <div class="one" >
        <div class="mini">class为mini</div>
        <div class="mini">class为mini</div>
        <div class="mini">class为mini</div>
        <div class="mini"></div>
    </div>
</body>

执行代码: alert($(“div”).eq(2).index());输出结果是下面哪一项?(B)

  • A. 4
  • B. 3
  • C. 2
  • D. 1

[!NOTE]

这是因为 $("div") 选取了文档中所有的 div 元素,然后 .eq(2) 针对这些元素取得第三个元素,即 id 为 two 的 <div> 元素,它在所有 div 元素中的索引位置是2。而 .index() 方法返回的是元素在其同级元素中的索引位置(从 0 开始计数),所以结果是 3。

4. 有如下HTML 代码:

<table width="400" border="1" cellspacing="0" cellpadding="0">
    <tr><td>1.</td><td>jQuery内容过滤选择器<span>第1行</span></td></tr>
    <tr><td>2.</td><td>jQuery内容过滤选择器第2行</td></tr>
    <tr><td>3.</td><td>jQuery内容过滤选择器第3行</td></tr>
    <tr><td>4.</td><td>jQuery第4行</td></tr>
    <tr><td>5.</td><td>jQuery第5行</td></tr>
    <tr><td>6.</td><td>第6行</td></tr>
    <tr><td>7.</td><td>第7行</td></tr>
    <tr><td>8.</td><td></td></tr>
</table>

则下面描述哪一项是错误的? (A)

  • A.$("td:empty")选择的是第8行的第1个单元格
  • B. $("td:parent")选择的是含有子元素或文本的td元素
  • C.$("tr:contains('内容')")选择的是第1,2,3行
  • D.$("tr:has('span')")选择的是第1行

[!NOTE]

$("td:empty") 是一个 jQuery 选择器,用于选取所有不包含任何内容(即无子元素和无文本)的 <td> 元素。
因此,它选取的是第 8 行的第二个单元格,而不是第一个。

5. 有如下HTML 代码:

<div class="box">
    <div>visibile</div>
    <div style="display:none">Hidden1</div>
    <div style="visibility:hidden">Hidden2</div>
    <div class="classHidden">Hidden3</div>
    <input type="hidden"/>
</div>

则jQuery 程序中的代码: $("div :hidden")选择的是哪些元素? (C)

  • A.<div style="visibility:hidden">Hidden2</div>
  • B.<div style="display:none">Hidden1</div>
  • C.<div style="display:none">Hidden1</div>,<input type="hidden" />
  • D.<input type="hidden" />

[!NOTE]

$("div :hidden") 是一个 jQuery 选择器,用于选取所有被隐藏的 <div> 元素及其他隐藏元素。

在给定的 HTML 代码中,有以下元素是被隐藏的:

  • <div style="display:none">Hidden1</div>
  • <input type="hidden" />

6. 下面哪一项描述是错误的? (A)

  • A. $("input:lt(1)")选取索引值大于1的<input>元素
  • B. $("input:even")选取索引值是偶数的<input>元素
  • C. $("div:last")选取所有<div>元素中最后一个<div>
  • D. $("input:not(.myClass)")选取class属性值不是myClass的<input>元素

[!NOTE]

$("input:lt(1)")是一个 jQuery 选择器,用于选取索引值小于 1 的 <input> 元素。而不是大于 1。

7. 有如下HTML 代码:

<form>
    <label>Name:</label>
    <input name="name" type="text" />
    <fieldset>
        <label>Newsletter:</label>
        <input name="newsletter" type=""text />
    </fieldset>
</form>
<input name="none" type="text"/> 

则jQuery 程序中的代码:$(“form>input”)选择的是哪些元素?(D)

  • A. <input name="name" type="text"/>, <input name="newsletter" type="text" />
  • B. <input name="newsletter" type="text" />
  • C. <nput name="none" type="text"/>
  • D. <input name="name" type="text" />

[!NOTE]

$("form>input")是一个jQuery选择器,它用于选择所有直接位于<form>元素内部的<input>元素。

在这个选择器中,form表示选择所有<form>元素,>表示选择其中的直接子元素,input表示选择所有<form>元素的直接子元素中是<input>元素的元素。

因此,$("form>input")选择的是所有直接位于<form>元素内部的<input>元素。

8. 有如下程序代码:

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>菜单关联</title>
    <script src="jquery-1.12.4.js" type="text/javascript"></script>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0
        }

        body {
            font-size: 12px;
            font-family: "宋体", "微软雅黑";
        }

        ul,
        li {
            list-style: none;
        }

        link,
        a:visited {
            text-decoration: none;
        }

        div.list {
            width: 210px;
            margin: 40px auto 0 auto;
        }

        .list a {
            display: block;
            font-weight: bold;
            height: 36px;
            line-height: 36px;
        }

        .list ul li {
            background-color: #467ca2;
            border-bottom: solid 1px #316a91;
        }

        .list ul li a {
            padding-left: 10px;
            color: #fff;
        }

        .list ul li ul {
            display: none;
        }

        .list ul li ul li {
            background-color: #6196bb;
            border-bottom: solid 1px #467ca2;
        }

        .list ul li ul li ul {
            display: none;
        }

        .list ul li ul li a {
            padding-left: 20px;
            color: #9FC;
        }

        .list ul li ul li ul li {
            background-color: #d6e6f1;
            border-bottom: solid 1px #6196bb;
        }

        .list ul li ul li ul li a {
            padding-left: 30px;
            color: #316a91;
        }
    </style>
    <script>
        $(function () {
            $("a.inactive").click(function () {
                if ($(this).next("ul").___(1)_____) $(this).next("ul").hide();
                else $(this).next("ul").show().___(2)___.siblings().___(3)____.hide();
        })
                        })
    </script>
</head>

<body>
    <div>
        <ul>
            <li><a href="#">学校概况</a>
                <ul>
                    <li><a href="#">科大简介</a>
                        <ul>
                            <li><a href="#">校园分布</a></li>
                            <li><a href="#">校园风光</a></li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">现任领导</a>
                    </li>
                    <li>
                        <a href="#">组织机构</a>
                        <ul>
                            <li><a href="#">党委机关</a></li>
                            <li><a href="#">团委机关</a></li>
                            <li><a href="#">行政机关</a></li>
                            <li><a href="#">群团组织</a></li>
                        </ul>
                    </li>
                </ul>
            </li>
            <li> <a href="#">教育教学</a>
                <ul>
                    <li><a href="#">本科生教育</a></li>
                    <li><a href="#">研究生教育</a></li>
                    <li><a href="#">继续教育</a></li>
                </ul>
            </li>
            <li> <a href="#">招生就业</a>
                <ul>
                    <li><a href="#">本科生招生</a></li>
                    <li><a href="#">研究生招生</a></li>
                    <li><a href="#">继续教育招生</a></li>
                    <li><a href="#">就业信息网</a></li>
                </ul>
            </li>
        </ul>
    </div>
</body>

</html>

补充完整功能实现,实现如下功能:

(1)单击菜单使下面的子菜单显示或隐藏;

(2)单击菜单使其下面的子菜单互斥显示。

效果如下图所示:(B)

img

  • A.

    (1) is(":visible")
    (2) parent()
    (3) children("ul")

  • B.

    (1) is(":visible")
    (2) parent()
    (3) find("ul")

  • C.

    (1) is("visible")
    (2) parent()
    (3) find("ul")

  • D.

    (1) is(":visible")
    (2) prev()
    (3) find("ul")

[!NOTE]

is(“:visible”):判断是否显示

find(“ul”):ul的所有后代节点

siblings():查找所有兄弟的节点

parent():查找父亲节点

9. 下面哪一项描述是错误的?(A)

  • A. $("#two>*")$("#two").siblings()等价
  • B. $(".one+span")$(".one").next("span")等价
  • C. $("div~span")$("div").nextAll("span")等价
  • D. $("div+span")$("div").next("span")等价

[!NOTE]

$("#two>*")表示选择#two下的所有子元素,而$("#two").siblings()表示选择#two的兄弟元素,因此它们并不等价。

10. 有如下HTML 代码:

<p>one</p>
<div><p>two</p></div>
<p>three</p>

则jQuery 程序中的代码: $(“div>p”)选择的是哪些元素?( B )

  • A. <p>three</p>
  • B. <p>two</p>
  • C. <div><p>two</p></div>
  • D. <p>one</p>

11. 在HTML页面中有如下结构的代码: ( D )

<div id=""header"">
    <h3><span>S3N认证考试</span></h3>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

请问下面哪一个选项所示的jQuery代码,不能够让汉字“四”的颜色变成红色?

  • A. $("#header li:eq(3)").css("color","red")
  • B. $("#header ul li:eq(3)").css("color","red")
  • C. $("#header li:last").css("color","red")
  • D. $"#header li:gt(3)").css("color","red")

[!NOTE]

$("header li:gt(3)")表示选择header下索引大于3的所有li元素,而题目中要求的是选择第4个li元素,所以这个代码并不能达到要求。

12. 有如下程序代码:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        ul,
        li {
            padding: 0;
            margin: 0;
            list-style: none;
            text-align: center;
        }

        #wrap {
            width: 330px;
            margin: 30px auto 0;
            height: 30px;
            background-color: blue;
            border-radius: 5px;
            padding: 0 5px;
        }

        #wrap>ul {
            height: 30px;
        }

        #wrap>ul>li {
            float: left;
            width: 100px;
            background-color: yellow;
            height: 30px;
            line-height: 30px;
            margin: 0 5px;
        }

        a {
            text-decoration: none;
            color: red;
        }

        #wrap .uu {
            background-color: pink;
            display: none;
        }
    </style>

    <script src="jquery-1.12.4.js"></script>
    <script>
        $(function () {
            $("li").mouseenter(function () {
                $(this).___(1)___.show();
            }).mouseleave(function () {
                $(this).___(2)_____.hide();
            })
        })
    </script>
</head>

<body>
    <div id="wrap">
        <ul>
            <li>
                <a href="javascript:;">一级菜单1</a>
                <ul>
                    <li>二级菜单11</li>
                    <li>二级菜单12</li>
                    <li>二级菜单13</li>
                </ul>
            </li>
            <li>
                <a href="javascript:;">一级菜单2</a>
                <ul>
                    <li>二级菜单21</li>
                    <li>二级菜单22</li>
                    <li>二级菜单23</li>
                </ul>
            </li>
            <li>
                <a href="javascript:;">一级菜单3</a>
                <ul>
                    <li>二级菜单21</li>
                    <li>二级菜单22</li>
                    <li>二级菜单23</li>
                </ul>
            </li>
        </ul>
    </div>
</body>

</html>

从下面选项中选择正确的答案补充完整程序,实现鼠标移动到一级菜单上时显示对应的子菜单,离开一级菜单时子菜单隐藏。效果如下图所示: (C)

img

  • A.

    (1) next("ul")

    (2) next("ul")

  • B.

    (1) prev("ul")

    (2) prev("ul")

  • C.

    (1) children("ul")

    (2) children("ul")

  • D.

    (1) find()

    (2) find()

[!NOTE]

children("ul") 是 jQuery 中的一个方法调用。它的意思是选择当前元素的所有直接子元素中符合指定选择器的元素,其中 "ul" 是选择器,表示选择所有标签名为 <ul> 的子元素。

<div class="parent">
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
    </ul>
    <p>Paragraph</p>
    <ul>
        <li>Item 3</li>
        <li>Item 4</li>
    </ul>
</div>

如果你使用 $(".parent").children("ul"),它会选择 class"parent"<div> 元素的所有直接子元素中标签名为 <ul> 的元素,也就是第一个和第二个 <ul> 元素。

next("ul") 是 jQuery 中的一个方法调用。它的意思是选择当前元素的下一个兄弟元素中符合指定选择器的元素,其中 "ul" 是选择器,表示选择下一个兄弟元素中标签名为 <ul> 的元素。

<div class="parent">
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
    </ul>
    <p>Paragraph</p>
    <ul>
        <li>Item 3</li>
        <li>Item 4</li>
    </ul>
</div>

如果你使用 $("p").next("ul"),它会选择标签名为 <p> 的元素的下一个兄弟元素中标签名为 <ul> 的元素,也就是第二个 <ul> 元素。

13. HTML代码如下:

<div class="one" id="one">
    id为one,class为one的div
    <div class="mini">class为mini</div>
</div>
<div class="one">
    <div class="mini">class为mini</div>
    <div class="mini">class为mini</div>
    <div class="mini">class为mini</div>
    <div class="mini"></div>
</div>

选择第一个div元素,用以下哪个选择器?(B)

  • A. $("div eq(0)")
  • B.$("div:first")
  • C.$("div:eq(1)")
  • D.$("div :first")

[!NOTE]

选项 A 中的选择器 $("div eq(0)") 包含了两个部分,分别是:

  • div:选择所有 <div> 元素。
  • eq(0):从匹配的元素集合中选取索引为 0 的元素。

然而,这个选择器有一个语法错误,应该修改为 $("div:eq(0)"),才能正确选择第一个 <div> 元素。

14. 有如下HTML 代码:

<html>

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src='jquery-1.12.4.js'></script>
    <script>
        $(function () {
            alert($("*").length);
        })
    </script>
</head>

<body>
    <p>河南科技大学</p>
    <div>DIV</div>
    <span>SPAN</span>
    <p>P</p>
</body>

</html>

则jQuery 程序中的代码:alert($(“*”).length)输出的结果是(D)?

  • A. 4
  • B. 6
  • C. 10
  • D. 11

15. 有如下HTML代码:

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>复选框效果</title>
    <style type="text/css">
        td {
            text-align: center;
            font-size: 24px;
            line-height: 36px;
        }

        input {
            display: inline-block;
            width: 24px;
            height: 24px;
        }

        input[type=button] {
            width: 100px;
        }
    </style>
    <script src="jquery-1.12.4.js"></script>
    <script>   $(function () {
            $("#all").click(function () {
                var ch = this.checked;
                $("input[name=product]").each(function () {
                    this.checked = ch;
                })
            })
            $("input[name=product]").click(function () {
                if ($("input[name=product]:checked").length == $("input[name=product]").length) $("#all")[0].checked = true; else $("#all")[0].checked = false;
            })
        }) </script>
</head>

<body>
    <table border="1" cellspacing="0" cellpadding="0" width="600px;" id="tb1">
        <tr>
            <td> <input type="checkbox" id="all" value="全选" />全选 </td>
            <td>商品名称</td>
            <td>价格</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="product" /></td>
            <td>网页设计</td>
            <td>25</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="product" /></td>
            <td>css + div布局</td>
            <td>26</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="product" /></td>
            <td>JavaScript程序设计</td>
            <td>28</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="product" /></td>
            <td>JQuery程序设计</td>
            <td>28</td>
        </tr>
    </table>
</body>

</html>

从下面选项中选择正确的答案补充完整程序,实现如下功能:(1)点击全选按钮后,根据全选按钮的选中状态来控制下面所有子复选框的状态相应的功能。(2)单击下面的单个复选框时,需要根据当前下面所有复选框的状态来确定全选复选框的状态,当下面所有复选框都选中时,全选复选框才选中,否则全选复选框不能选中。(A)

3.png

  • A.

    (1)each

    (2)this.checked

    (3)input[name=product]

    (4)input[name=product]:checked

  • B.

    (1)each

    (2)this.checked

    (3)input[name=product]

    (4)input:checked

  • C.

    (1)each

    (2)$(this).checked

    (3)input

    (4)input[name=product]:checked

  • D.

    (1)each

    (2)this.checked

    (3):checkbox

    (4)input[name=product]:checked

16. 有如下程序代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
            ul{
                list-style: none;
                width: 160px;
            }
            
            ul,li{
                padding:0;
                margin:0;
                border-bottom: 1px solid #fff;
            }
            
            li>span{
                display: block;
                background-color: pink;
            }
            
            li>div{
                height: 120px;
                background-color: yellow;
                display: none;
            }
        </style>
        <script src="jquery-1.12.4.js"></script>
        <script> $(function(){
                $("span").click(function(){
                    $(this).___(1)____.show().____(2)___.siblings().____(3)____.hide();
                });
            })
        </script>
    </head>
    <body>
        <ul>
            <li>
                <span>标题1</span>
                <div>我是弹出来的div1</div>
            </li>
            <li>
                <span>标题2</span>
                <div>我是弹出来的div2</div>
            </li>
            <li>
                <span>标题3</span>
                <div>我是弹出来的div3</div>
            </li>
            
            <li>
                <span>标题4</span>
                <div>我是弹出来的div4</div>
            </li>
        </ul>
    </body>
</html>

补充完整功能实现,实现单击标题使其下面的div元素互斥显示。 效果如下图所示: (D)

img

  • A.

    (1)fin()

    (2)parent()

    (3)children(“div”)

  • B.

    (1)next()

    (2)parent()

    (3)children()

  • C.

    (1)next()

    (2)parent()

    (3)find()

  • D.

    (1)next()

    (2)parent()

    (3)children(“div”)

[!NOTE]

在程序中,单击标题元素时,需要显示其下面的div元素,并隐藏其他兄弟元素的div。因此,我们需要先找到标题元素所在的<li>元素,再从<li>元素中找到它的直接子元素<div>,将其显示出来,同时将其他兄弟元素的<div>元素隐藏掉。

具体来说,答案D中的代码含义如下:

  1. next()方法:选择当前元素的下一个同级元素,即<div>元素。

  2. parent()方法:选择当前元素的父节点,即<li>元素。

  3. children("div")方法:选择当前元素的所有直接子元素中的<div>元素。

综上所述,答案D能够实现题目要求的功能。

17. 有如下程序代码:

<html>
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script src="jquery-1.12.4.js"></script>
        <script>
            $(function(){
                var att="";
                for(i=0;i<$("*").length;i++) att+=$("*")[i].tagName+"\n";
                //深度优先遍历
                alert(att);
            });
        </script>
    </head>
    <body>
        <ul>
            <li>我是第1个列表项</li>
        </ul>
        <div>我是div元素</div>
    </body>
</html>

运行后结果是( A)。

  • A.

    HTML
    HEAD
    META
    TITLE
    SCRIPT
    SCRIPT
    BODY
    UL
    LI
    DIV

  • B.

    HTML
    HEAD
    META
    TITLE
    SCRIPT
    SCRIPT
    BODY
    UL
    DIV
    LI

  • C.

    HTML
    HEAD
    META
    TITLE
    BODY
    UL
    DIV
    LI
    SCRIPT
    SCRIPT

  • D.

    HTML
    HEAD
    BODY
    META
    TITLE
    SCRIPT
    SCRIPT
    UL
    DIV
    LI

[!NOTE]

输出所有标签,按照优先遍历的顺序输出

18. 有如下程序代码:

<html>
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script src="jquery-1-12.4.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function(){
                $("p").click(function(){ ____(1)_____; });
            })
        </script>
    </head>
    <body>
        <p>段落一</p>
        <p>段落二</p>
        <p>段落三</p>
    </body>
</html>

补充程序实现单击页面的p元素,其内容变为红色。(A)

  • A. (1)this.style.color="red"
  • B. (1)$(this)[0].css("color","red)
  • C. (1)this.css("color","red)
  • D. (1)$(this).style.color="red"

19. HTML代码如下:

<form id="form1" action="#">
    <input type="button" value="Button" /><br />
    <button>提交</button><input type="image" /><br />
    <input type="reset" /><br />
    <input type="submit" value="提交" /><br />
</form>

执行代码alert($(“:button”).length);输出结果是哪一个?(C)

  • A.3
  • B.1
  • C.2
  • D.4

[!NOTE]

根据给定的 HTML 代码,有两个类型为 “button” 的元素:一个是 <input type="button">,另一个是 <button>。因此,alert($(":button").length) 将输出 2。

20. 有如下HTML代码:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>精品展示</title>
    <style>
        ul,
        li {
            padding: 0;
            margin: 0;
            list-style: none;
        }

        .wrapper {
            width: 298px;
            height: 243px;
            margin: 100px auto 0;
            border: 1px solid pink;
        }

        #left,
        #center,
        #right {
            float: left;
            height: 243px;
        }

        #left,
        #right {
            width: 80px;
        }

        #center {
            width: 138px;
            height: 243px;
        }

        #left li,
        #right li {
            background-color: rgba(200, 200, 200, 0.3);
            height: 27px;
        }

        #left li a,
        #right li a {
            display: block;
            height: 26px;
            border-bottom: 1px solid pink;
            line-height: 26px;
            text-align: center;
            color: red;
            text-decoration: none;
            font-size: 12px;
        }

        #left li a:hover,
        #right li a:hover {
            color: blue;
            background-color: yellow;
            text-decoration: underline;
        }

        #center li {
            height: 243px;
            background-color: rgba(255, 255, 0, 0.3);
        }

        #center li a {
            display: block;
            height: 243px;
            line-height: 243px;
            text-align: center;
            font-size: 40px;
            text-decoration: none;
            color: #000;
        }

        #center>li {
            display: none;
        }

        #center>li:nth-child(1) {
            display: block;
        }
    </style>
    <script src="jquery-1.12.4.js"></script>
    <script>
        $(function () {
            $("#left>li").mouseenter(function () {
                var index = ___(1)____; 
                $("#center>li:eq(" + index + ")").show().siblings().hide(); 
            })      
           $("#right>li").mouseenter(function () { 
               var index = ___(2)_____;
               $("#center>li:eq(" + index + ")").show().siblings().hide(); }) 
            })
    </script>
</head>

<body>
    <div>
        <ul id="left">
            <li><a href="#">女靴</a></li>
            <li><a href="#">雪地靴</a></li>
            <li><a href="#">冬裙</a></li>
            <li><a href="#">呢大衣</a></li>
            <li><a href="#">毛衣</a></li>
            <li><a href="#">棉服</a></li>
            <li><a href="#">女裤</a></li>
            <li><a href="#">羽绒服</a></li>
            <li><a href="#">牛仔裤</a></li>
        </ul>
        <ul id="center">
            <li><a href="#">女靴</a></li>
            <li><a href="#">雪地靴</a></li>
            <li><a href="#">冬裙</a></li>
            <li><a href="#">呢大衣</a></li>
            <li><a href="#">毛衣</a></li>
            <li><a href="#">棉服</a></li>
            <li><a href="#">女裤</a></li>
            <li><a href="#">羽绒服</a></li>
            <li><a href="#">牛仔裤</a></li>
            <li><a href="#">女包</a></li>
            <li><a href="#">男包</a></li>
            <li><a href="#">登山鞋</a></li>
            <li><a href="#">皮带</a></li>
            <li><a href="#">围巾</a></li>
            <li><a href="#">皮衣</a></li>
            <li><a href="#">男毛衣</a></li>
            <li><a href="#">男棉服</a></li>
            <li><a href="#">男靴</a></li>
        </ul>
        <ul id="right">
            <li><a href="#">女包</a></li>
            <li><a href="#">男包</a></li>
            <li><a href="#">登山鞋</a></li>
            <li><a href="#">皮带</a></li>
            <li><a href="#">围巾</a></li>
            <li><a href="#">皮衣</a></li>
            <li><a href="#">男毛衣</a></li>
            <li><a href="#">男棉服</a></li>
            <li><a href="#">男靴</a></li>
        </ul>
    </div>
</body>

</html>

从下面选项中选择正确的答案补充完整程序,实现当鼠标移动到下图某个菜单项时,在中间显示相应的文字,效果如下图所示。(D)

2.png

  • A.

    (1)this.index

    (2)this.index+9

  • B.

    (1)$(this).index()

    (2)$(this).index()

  • C.

    (1)this.index()

    (2)this.index()+9

  • D.

    (1)$(this).index()

    (2)$(this).index()+9

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/639025.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

合约开发的基本结构剖析及前置知识梳理

前置知识点 上下文变量初步 合约函数的背后是transaction&#xff0c;上下文变量访问的是transaction中的信息两个上下文变量&#xff1a;tx和msg ERC20 规范代码实现Metamask测试 ganache-cli的安装 安装 npm install -g ganache-cli启动 ganache-cli如果出现以下这种…

本特利330103-03-09-10-02-00 PLC模块技术分析与应用探讨

本特利330103-03-09-10-02-00 PLC模块技术分析与应用探讨 一、引言 在工业自动化领域中&#xff0c;可编程逻辑控制器&#xff08;PLC&#xff09;作为核心控制设备&#xff0c;其性能的稳定性和可靠性直接关系到整个生产线的运行效率。本特利&#xff08;Bentley&#xff09;…

求第 N 个泰波那契数 | 动态规划

1.第 N 个泰波那契数 题目连接&#xff1a;1137. 第 N 个泰波那契数 泰波那契序列 Tn 定义如下&#xff1a; T0 0, T1 1, T2 1, 且在 n > 0 的条件下 Tn3 Tn Tn1 Tn2给你整数 n&#xff0c;请返回第 n 个泰波那契数 Tn 的值。 2.什么是动态规划 在解决这道问题之前…

获取日期区间的所有日期

借助moment.js 转换指定格式&#xff0c;首先安装npm install moment --save methods:{enumerateDaysBetweenDates(startDate, endDate) { // 假定你已经保证了startDate 小于endDate&#xff0c;且二者不相等let daysList [];let SDate this.$moment(startDate);let EDate …

计算机系统基础 8 循环程序

概要 两种实现方法——分支指令实现和专门的循环语句实现以及有关循环的优化。 分支指令实现 倒计数 …… MOV ECX&#xff0c;循环次数 LOOPA&#xff1a;…… …… DEC ECX JNE LOOPA 正计数 …… MOV ECX&#xff0c;0 LOOPA&#xff1a; …… INC ECX CMP …

U-Boot menu菜单分析

文章目录 前言目标环境背景U-Boot如何自动调起菜单U-Boot添加自定义命令实践 前言 在某个厂家的开发板中&#xff0c;在进入它的U-Boot后&#xff0c;会自动弹出一个菜单页面&#xff0c;输入对应的选项就会执行对应的功能。如SD卡镜像更新、显示设置等&#xff1a; 目标 本…

ESP8266实现获取天气情况

利用太极创客提供的ESP8266 心知天气库获取天气情况并显示 心知天气库地址&#xff1a; ESP8266-心知天气: 本库主要功能为使用ESP8266物联网开发板通过心知天气 API 获取天气等信息。 clone到本地: git clone https://gitee.com/taijichuangke/ESP8266-Seniverse.git 安装该…

go语言的一些常见踩坑问题

开始之前&#xff0c;介绍一下​最近很火的开源技术&#xff0c;低代码。 作为一种软件开发技术逐渐进入了人们的视角里&#xff0c;它利用自身独特的优势占领市场一角——让使用者可以通过可视化的方式&#xff0c;以更少的编码&#xff0c;更快速地构建和交付应用软件&#…

ArkUI-X开发指南:【SDK配置和构建说明】

ArkUI-X SDK配置和构建说明 ArkUI-X SDK是ArkUI-X开源项目的编译产物&#xff0c;可将ArkUI-X SDK集成到现有Android和iOS应用工程中&#xff0c;使开发者基于一套ArkTS主代码&#xff0c;就可以构建支持多平台的精美、高性能应用。SDK内容包含ArkUI跨平台运行时&#xff0c;组…

【高频】从输入URL到页面展示到底发生了什么?

一、相关衍生面试问题&#xff1a; 浏览器输入美团网站&#xff0c;从回车到浏览器展示经历了哪些过程 &#xff1f; http输入网页之后的流程&#xff1f; 百度搜索页面&#xff0c;从点开搜索框&#xff0c;到显示搜索页面经历了什么&#xff1f; 二、探究各个过程&#x…

[Algorithm][回溯][记忆化搜索][最长递增子序列][猜数字大小Ⅱ][矩阵中的最长递增路径]详细讲解

目录 1.最长递增子序列1.题目链接2.算法原理详解3.代码实现 2.猜数字大小 II1.题目链接2.算法原理详解3.代码实现 3.矩阵中的最长递增路径1.题目链接2.算法原理详解3.代码实现 1.最长递增子序列 1.题目链接 最长递增子序列 2.算法原理详解 题目解析&#xff1a;从每个位置&am…

【BUG】Edge|联想电脑 Bing 搜索报错“Ref A: 乱码、 Ref B:乱码、Ref C: 日期” 的解决办法

文章目录 省流版前言解决办法 详细解释版前言问题描述与排查过程解决办法与总结 省流版 我原以为我解决了&#xff0c;才发的博客&#xff0c;晚上用了一下其他设备发现还是会出现这个问题… 这篇博客并未解决该问题&#xff0c;如果评论里有人解决了这个问题不胜感激&#x…

博客说明 5/12~5/24【个人】

博客说明 5/12~5/24【个人】 前言版权博客说明 5/12~5/24【个人】对比最后 前言 2024-5-24 13:39:23 对我在2024年5月12日到5月24日发布的博客做一下简要的说明 以下内容源自《【个人】》 仅供学习交流使用 版权 禁止其他平台发布时删除以下此话 本文首次发布于CSDN平台 作…

Undet for SketchUp 2023.3 点云建模软件 支持支持草图大师sketchup2021-2022-2023

1.Undet for sketchup 2023.3支持草图大师sketchup2021-2022-2023。支持机载雷达扫描、车载扫描还是地面扫描&#xff0c;对AEC行业用户来说&#xff0c;真正需要的是如何将这些数据快速处理为三维模型&#xff0c;这样才能将这些信息延展到BIM领域发挥效用。因此面对这些海量的…

【真实项目中收获的提升】- 前后端联调

场景 小型项目前后端联调&#xff0c;不需要部署到sit或uat环境下。 解决方法 后端部署frp服务 下载frp软件 配置frpc.ini文件&#xff0c;先把文件设置可编辑(可同时配置多个 例如下面的chz 上面打码的是frp服务器地址) 然后起start.bat 其实就是执行frpc -c frpc.ini命令…

4、PHP的xml注入漏洞(xxe)

青少年ctf&#xff1a;PHP的XXE 1、打开网页是一个PHP版本页面 2、CTRLf搜索xml&#xff0c;发现2.8.0版本&#xff0c;含有xml漏洞 3、bp抓包 4、使用代码出发bug GET /simplexml_load_string.php HTTP/1.1 补充&#xff1a; <?xml version"1.0" encoding&quo…

DockerNetwork

Docker Network Docker Network 是 Docker 引擎提供的一种功能&#xff0c;用于管理 Docker 容器之间以及容器与外部网络之间的网络通信。它允许用户定义和配置容器的网络环境&#xff0c;以便容器之间可以相互通信&#xff0c;并与外部网络进行连接。 Docker Network 提供了以…

docker容器安装mysql

linux: centOS-7 hadoop: 3.3.6 前置章节&#xff1a; (图文并茂)基于CentOS-7搭建hadoop3.3.6大数据集群-CSDN博客 可选&#xff1a;zookeeper安装教程-CSDN博客 1.安装docker 1.1 添加docker的repo源 sudo yum-config-manager --add-repo http://mirrors.aliyun.com/…

猫狗电子玩具底层方案开发

物在现代年轻人中的地位已经超越了简单的“宠物”定义&#xff0c;它们已经成为了家庭的一部分&#xff0c;是人们生活中不可或缺的伴侣和朋友。 因此营运而生了很多宠物用品&#xff0c;比如喂食器、电子逗猫棒、饮水机、说话按钮等等宠物电子玩具周边。宠物玩具在宠物生活中…

Python-3.12.0文档解读-内置函数hash()详细说明+记忆策略+常用场景+巧妙用法+综合技巧

一个认为一切根源都是“自己不够强”的INTJ 个人主页&#xff1a;用哲学编程-CSDN博客专栏&#xff1a;每日一题——举一反三Python编程学习Python内置函数 Python-3.12.0文档解读 目录 详细说明 功能描述 参数 返回值 特性 使用示例 注意事项 记忆策略 常用场景 …