admin 管理员组

文章数量: 1087139


2024年6月13日发(作者:古代好听的颜色名字)

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

考试科目

命题人: 审阅人:

(2021-2022 学年第 一 学期期末考试)

响应式Web应用前端开发教程期

末考试卷及答案

-

-

-

-

-

-

-

-

-

-

-

一、填空(5分,每空1分)

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

线

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

第1页,共31页

1、jQuery默认的缩写符号是 。

2、Bootstrap设置右侧外边距为1倍$spacer 。

3、Bootstrap信息提示框基础类是 。

4、jQuery3.2.1版本中推荐使用 为元素绑定事件和处理函数,使用

函数解除绑定。

二、单选题(30分,每题3分)

1、设置Bootstrap卡片体中副标题的类是( )

A..title

B..subtitle

D..card-title C..card-subtitle

2.、jQuery设置元素样式的方法是( )

A.first()

C.css()

B.eq()

D.style()

3、Bootstrap4通过为卡片组的外包裹元素设置类( )实现手风琴效果

A..accordion

C..card-group

B..card

D..streched-card

4、Bootstrap4设置文本居右的类是( )

A.text-right

C.right-text

B.align-right

D.right-align

5、Bootstrap巨幕基础类是( )。

A..jump

C、.jumb

B、.jumbotron

D、.jumbotron-fluid

6、Bootstrap圆圈形加载动画的基础类是

A..spinner

C. .spinner-grow D..spinner-border

7、中中文字的占位符是( )

A.@cword

C.@cletter

B.@ccentence

D.@ctext

B..spinner-circle

8、可以使图片呈现缩略图效果的类是( )

A..img

B..img-shrink

D..img-thumbnail C..img-fluid

9、 使用下列哪个方法可以以滑动效果显示HTML元素( )。

第2页,共31页

A.slideToggle()

C.slideUp()

B.slideDown()

D.slie()

10. Bootstrap提供了一系列的对齐样式,表示超出屏幕部分不换行的样式是( )

A. text-center

C . text-auto

B. text-justify

D. text-nowrap

三、多选题(10分,每题2分)

1、下列哪些是正确的BootStrap文本类( )。

A. .text-primary

C. . text-danger

B. . text-info

D. . text-red

2、下列那些是BootStrap定义的主题颜色( )。

A. .blue

C. .warning

B .orange

D. muted

3、下列正确的定位相关的Bootstrap类是( )。

A. .position-static

B ..position-relative

D. .position-sticky C. .position-absolute

4、下列Bootstrap断点设置与像素对应正确的是( )。

A. sm(540px)

C. md (720px)

B .xl(1200px)

D. lg(992px)

5、下列哪些jQuery方法可以向指定元素中添加元素( )。

A append()

C after()

B prepend()

D before()

四、判断题(20分,每题2分)

1、( )BootStrap内置了一套响应式、移动设备优先的流式栅格系统,最多24列

2、( )Ajax请求成功时触发局部事件success。

3、( )语法中的“jQuery”是大小写敏感的。

4、( )可以在导航链接标签配置disable类禁用Bootstrap选项卡。

5、( )文件名中含有“min”的Bootstrap库文件经过“压缩”减小了文件大小。

第3页,共31页

6、( ).one()为指定元素绑定事件和处理函数。每个元素可多次运行事件处理器函

数。

7、( )Bootstrap媒体对象只能实现左图右文的图文单元。

8、( )事件由目标元素向祖先元素逐级传递,直到DOM根节点的机制称为事件捕

获。

9、( )Bootstrap4.6的组件行为是不依赖jQuery的。

10、( )媒体对象组件需要设置“.positon-relative”类来支持延展链接。

五、问答题(25分)

1、试述响应式布局的优缺点(5分)

2、列出至少5中jQuery选择器并简述其功能。(5分)

3、试列举Bootstrap图标的三种用法。(5分)

第4页,共31页

4、列举5种具有JS行为的Bootstrap组件。(5分)

5、试述“互联网+”创业、创新的理解,以及相关的创业、创新思路。(5分)

第5页,共31页

六、程序填空题(10分)

1、补足下列空白出,采用Bootstrap4卡片组件实现上图下文的图文单元,设置延展链接,

超链效果在整个卡片区域有效。(5分,每空1分)

婺源

婺源县,隶属于江西省上饶市,位于江西省东

北部,总面积2967平方千米。

2、将代码空白的部分(要求使用jQuery)补充完整,完成如下要求的功能:(5分)

1)表格首行和尾行的颜色为绿色(green),数据行做斑马纹效果底色为浅绿色

(lightgreen)

2)表格最后一个单元格中显示所有“食品类”商品的价格总和。

如下图所示

第6页,共31页

第7页,共31页

编号 分类 名称 价格(元)
01 食品 农夫山泉矿泉水 2.00
02 日用品 洗发水 25.00
03 娱乐休闲 暑假旅游 5000.00
04 食品 面包 20.00
总额 20.00

第8页,共31页

第9页,共31页

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

考试科目

试卷答案(A卷)

命题人: 审阅人:

(2021-2022 学年第 一 学期期末考试)

适用专业

班级 (年级)

-

-

-

-

-

-

-

-

-

-

一、填空(5分,每空1分)

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

线

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

第10页,共31页

1、$

2、mr-3

3

、toast

4、on()、off()

二、单选题(30分,每题3分)

1、

C 2、C 3、A . 4、A 5、B.

6、B. 7、A 8、D. 9、C 10、D.

三、多选题(10分,每题2分)

1、AB

C 2、CD 3、

AB

CD. 4、BD 5、ABCD.

四、判断题(20分,每题2分)

1、X 2、√ 3、√ 4、X 5、√

6、X 7、X 8、X 9、X 10、√

五、简答题(25分)

1、试述响应式布局的优缺点(5分)

答:

优点:

面对不同分辨率设备灵活性强

能够快捷解决多设备显示适应问题

缺点:

兼容各种设备工作量大,效率低下

代码累赘,会出现隐藏无用的元素,加载时间加长

2、.列出至少5种jQuery选择器并简述其功能(5分)

答:

选择器

id选择器

类选择器

具 体 描 述

根据id选取对应的html元素

根据应用的css类选取对应的html元素

第11页,共31页

标签名选择器

祖先后代选择器

父子选择器

prev~siblings选择器

prev+next前后选择器

根据标签的名称选取对应的html元素

选择指定祖先元素的所有指定类型的后代元素

选择指定父元素的所有指定类型的子元素

选择指定prev元素后的根据siblings过滤的元素

选择指定prev元素后的所有next元素

上表中列出的仅供参考,答对任意5个选择器均可得分。

3、试列举Bootstrap图标的三种用法。(5分)

答:

 Svg HTML引用,在HTML文件中引用目标图标的svg html代码。

 作为svg图片引用,需要下载或者网络引用目标图标的svg文件。

 以web字体的方式引用,需要下载或者网络引用图标库样式文件,并配置目标图

标类。

4、列举5种具有JS行为的Bootstrap组件。(5分)

答:

轮播器、下拉菜单、模态框、折叠面板、选项卡导航

5、试述“互联网+”创业、创新的理解,以及相关的创业、创新思路。(5分)

开放性答案

六、编程题(10分)

1、补足下列空白出,采用Bootstrap4卡片组件实现上图下文的图文单元,设置延展链接,

超链效果在整个卡片区域有效。(5分,每空1分)

婺源

婺源县,隶属于江西省上饶市,位于江西省东北部,总

面积2967平方千米。

第12页,共31页

2、将代码空白的部分补充完整(要求使用jQuery),完成如下要求的功能:(5分)

1、表格首行和尾行的颜色为绿色(green),数据行做斑马纹效果底色为浅绿色

(lightgreen)

2、表格最后一个单元格中显示所有“食品类”商品的价格总和。

如下图所示

评分标准

jQuery选择器使用

jQuery设置样式

1分

1分

1分

1分

1分

jQuery循环流程控制

jQuery获取文本并计算

jQuery输出

第14页,共31页

编号 分类 名称 价格(元)
01 食品 农夫山泉矿泉水 2.00
02 日用品 洗发水 25.00
03 娱乐休闲 暑假旅游 5000.00
04 食品 面包 20.00
总额 20.00

第15页,共31页

草稿纸页

(此页与试卷一起装订,作为试卷第9页)

第16页,共31页


本文标签: 元素 设备 设置 效果 引用