欢迎来到计算机相关教程网!

JavaScript

当前位置: 主页 > 网页制作 > JavaScript

网页交互开发高级第十章课后习题及答案

时间:2022-08-25 10:00:20|栏目:JavaScript|点击:

课后习题:

、填空题

1. 在筛选选择器中,通过______方法获取第一个li元素  

2. jQuery动画中,通过______方法用来控制元素的淡入显示

3. 在筛选选择器中,通过______方法获取最后一个li元素

4. jQuery动画中,通过______方法显示被隐藏的匹配元素

5. jQuery操作类名的方法中,通过______方法向被选元素添加一个或多个类名

二、判断题

1. jQuery是一个快速、简洁的JavaScript库,其设计宗旨是“write lessdo more。( 

2. jQuery文件的类型主要包括未压缩(uncompressed)的开发版和压缩(minified)后的生产版。 

3. jQuery引入后,在全局作用域下会新增“$”和“jQuery”两个全局变量  

4.  $("div")可以获取div元素,这种方式就是通过jQuery选择器来获取元素。  

5. id选择器获取指定id的元素,语法表示为$(".id") 

三、选择题

1. 下列选项中,通过标签名获取元素的是(  

A. $("#id")  B. $(".class")  C. $("div")   D. $("*")

2. 下列筛选选择器中,获取li元素,并选择索引为奇数的元素的是 )。

A. $("li:first")   B. $("li:last")   C. $("li:odd")   D. $("li:even")

3. jQuery提供了用于停止动画效果的方法是 )。

A. stop()   B. fadeTo()   C. animate()   D. show()

4. 下面选项中,可以实现从被选元素移除一个或多个类的是 )。

A. removeClass()   B. toggleClass()   C. toggle()  D. addClass()

5. 下列关于jQuery的说法,错误的是 )。

A. jQuery是一个轻量级的脚本,其代码非常小巧。

B. 不支持CSS 1~CSS 3定义的属性和选择器。

C. 实现了JavaScript脚本和HTML代码的分离,便于后期编辑和维护

D. 插件丰富,可以通过插件扩展更多功能

四、简答题

1. 请列举jQuery中基本选择器有哪些。

2. 请例举操作元素类名的方法有哪些。

五、编程题

1. 请使用jQuery设置页面中的div元素的宽度为200px,高度200px

2. 请使用jQuery实现页面中div元素向右运动100px后回到初始位置的动画效果。

答案:

一、 填空题

1. :first

2. fadeIn()

3. :last

4. show()

5. addClass()

二、 判断题

1. 

2. 

3. 

4. 

5. 

三、 选择题

1. C

2. C

3. A

4. A

5. B

四、 简答题

1. 请列举jQuery中基本选择器有哪些

id选择器:获取指定id的元素,语法$("#id")

全选选择器:匹配所有元素,语法$("*")

类选择器:获取同一类class的元素,语法$(".class")

标签选择器:获取相同标签名的所有元素,语法$("div")

并集选择器:选取多个元素,语法$("div,p,li")

交集选择器:交集元素,语法$("li.current")

2. 请列举操作元素类名的方法有哪些

addClass()方法向被选元素添加一个或多个类名

removeClass()方法从被选元素移除一个或多个类

toggleClass()方法用来为元素添加或移除某个类,如果类不存在,就添加该类,如果类存在,就移除该类。

五、 编程题

1. 定义div元素:

<div style="background-color:red"></div>

jQuery代码如下:

$('div').css({width:'200px',height:'200px'});

2. 定义div元素:

<button>向右移动</button>

<div style="background-color:red;width:50px;height:50px;position:absolute;"></div>

jQuery代码如下:

    $("button").click(function () {

      $("div").animate({

        left: 100,

      }, 500);

    });

    $("button").click(function () {

      $("div").animate({

        left: 0,

      }, 500);

    });


上一篇:网页交互开发高级第九章课后习题及答案

栏    目:JavaScript

下一篇:网页交互开发高级第十一章课后习题及答案

本文标题:网页交互开发高级第十章课后习题及答案

本文地址:http://www.wangzhanteacher.com/?m=home&c=View&a=index&aid=229

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:8044517 | 邮箱:8044517@qq.com

Copyright © 2022-2025 计算机相关教程网 版权所有 Powered by EyouCms冀ICP备17010187号