响应式Web程序设计【7】

原创于 2022-01-21 08:01:51 发布 · 2k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#java

本文通过问答形式介绍了前端技术的关键概念，包括Bootstrap、响应式设计、JavaScript基础等知识点，帮助读者掌握前端开发的基本技能。

1. Bootstrap中，通过对表格调用类（）可实现响应式表格。（2 分）

A. .table-hover
B. .table-responsive
C. .table-condensed
D. .table-striped

2. 媒体查询可以（）（2 分）

A. 让CSS能更精确地作用于不同的媒体类型和同一媒体的不同条件
B. 为一些特定的输出设备定制特定的显示效果
C. 为不同终端的用户都能提供较好的浏览体验
D. 为不同终端的用户实现不同跳转

3. 浏览器及相关对象的模型结构中，最顶层对象是（）（2 分）

A. document
B. window
C. navigator
D. html

4. 制作网页上的浮动广告时，需要定义一个函数，实现浮动广告层随滚动条滚动的效果，假如已经定义好了这个名为move的函数，那么最后需要做的是（）。（2 分）

A. 捕获窗口的window.onscroll事件，调用move函数
B. 捕获文档的document.onscroll事件，调用move函数
C. 捕获窗口的window.onload事件，调用move函数
D. 捕获文档的document.onload事件，调用move函数

5. JavaScript函数返回值类型可能因其执行情况的不同而不同。（1 分）

A. 正确
B. 错误

6. Math对象的属性在使用前要先创建对象实例。（1.5 分）

A. 正确
B. 错误

7. 在网格布局中，每个元素可占用一列或多列网格。（1.5 分）

A. 正确
B. 错误

8. 在固定布局中，每个网页元素的宽度以（）指定。（2 分）

A. 像素值
B. 百分比
C. 相对大小
D. 厘米

9. DOM结构中，属性节点总是被包含在元素节点中。（1 分）

A. 正确
B. 错误

10. 固定布局的特点不包括（）（2 分）

A. 每个网页元素的大小定义都必须指定固定的像素值
B. 提供了很强的稳定性与可控性
C. 可以精确地控制每个元素所在的网页中的具体位置
D. 对任何设备都可以提供很好的浏览体验

11. 要通过JavaScript获取表单中指定元素的个数，通常使用（）属性（2 分）

A. select
B. value
C. elements
D. length

12. JavaScript中，当break语句用于循环语句时，表示退出该重循环返回循环判断处。（1 分）

A. 正确
B. 错误

13. JavaScript中应用history对象的back()方法相当于"前进”按钮，forward()方法相当于"后退”按钮。（1 分）

A. 正确
B. 错误

14. typeof(12)的值为（）（2 分）

A. string
B. number
C. object
D. boolean

15. 关于JavaScript中的NaN的说法，不正确的是（）（2 分）

A. 表示不是数字的结果
B. 通常用于表示一个变量或一个函数的返回值不是属于数值类型
C. 是JavaScript中专门定义表示特殊运算结果的一个数值量
D. 变量已建立，但没有指定初始值时其值为NaN

16. JavaScript函数定义时需给出参数的类型。（1 分）

A. 正确
B. 错误

17. 如果一个变量或一个函数的返回值不是数值类型，在JavaScript中用undefined表示。（1.5 分）

A. 正确
B. 错误

18. 下面关于JavaScript中Math对象的使用，不正确的是（）。（2 分）

A. Math对象的属性和方法都是静态的
B. Math对象的方法可以直接调用
C. Math对象的属性是一些常用的数学常量
D. Math对象也可以创建实例

19. typeof('s'))的值为（）（2 分）

A. string
B. number
C. object
D. boolean

20. 要使用任何一个JavaScript对象，都必须先用new创建它。（1 分）

A. 正确
B. 错误

21. JavaScript中的NaN表示不是数字的结果。（1.5 分）

A. 正确
B. 错误

22. JavaScript中document对象的getElementByTagName的方法是通过元素节点的（）获取并访问对象。（2 分）

A. id属性
B. name属性
C. 标签
D. class属性

23. 以下这个语句，表示屏幕像素密度为3倍的时候，匹配的图像是（）＜ｉmg ｓrcset ="img/1_1280.jpg 3x,img/1_640.jpg 2x,img/1_320.jpg 1x"/＞（2 分）

A. 1_1280.jpg
B. 1_640.jpg
C. 1_320.jpg
D. 无匹配的图像

24. ＜blockquote＞默认居左显示，也可以通过设置类. blockquote-reverse或者. pull-right使引用文本居右。（1 分）

A. 正确
B. 错误

25. 以下语句使用了srcset属性根据屏幕的（）来匹配显示的图像。＜img srcset =“img /1_1280.jpg 3x,img/1_640.jpg 2x,img/1_320.jpg 1x”/＞（2 分）

A. 宽度
B. 高度
C. 颜色位数
D. 像素密度

26. Bootstrap重新定义了HTML中的h1～h6的6级标题。（1 分）

A. 正确
B. 错误

27. 自适应网页可能使得维护的工作将呈几何级数上升，还会大大地增加架构设计的复杂度。（1.5 分）

A. 正确
B. 错误

28. 下列关于JavaScript数据类型的说法，不正确的是（）（2 分）

A. JavaScript中的变量可以具有多种数据类型，根据程序动态运行情况决定
B. JavaScript中的整型长度与是计算机的执行环节和操作系统无关
C. JavaScript中的整型数据和浮点型数据是严格区分的
D. JavaScript中字符串类型采用的国际字符集Unicode

29. JavaScript中可输出parseFloat("1abc")的值为（）。（2 分）

A. abc
B. 1
C. NaN

30. prompt语句返回的值的类型默认是字符串类型。（1 分）

A. 正确
B. 错误

31. 常用媒体特性中，（）定义输出设备中的屏幕最小可见高度及宽度。（2 分）

A. max- height，max- width
B. max- device- height，max- device- width
C. min- width，min- height
D. min- device- height，min- device- width

32. Bootstrap中以下代码实现了一个（）按钮。＜button type="button" class="close"＞&ｔimes;＜。（2 分）

A. 打开
B. 关闭
C. 刷新
D. 提交

33. ｄocument.write()语句用于（）。（2 分）

A. 在浏览器窗口中输出指定内容
B. 在HTML文档载入时调用程序
C. 关闭浏览器窗口
D. 在浏览器标题栏输出指定内容

34. Flex布局比较适合用于小规模的布局，比如应用程序中的组件布局。（1 分）

A. 正确
B. 错误

35. 在导入Bootstrap的网页中对图片添加对.img-responsive 类的调用，可以让图片支持响应式布局。（1 分）

A. 正确
B. 错误

36. 以下HTML代码定义的媒体查询条件下，如果设备的屏幕方向为纵向，则页面背景颜色为（）ｂody { ｂackground-color:silver ; } ＠media only screen and (orientation: landscape) { ｂody { ｂackground-color: lightblue; } }（2 分）

A. 银色
B. 红色
C. 蓝色
D. 浅蓝色

37. 响应式网页时，在开发时一般"以（）优先”。（2 分）

A. 大屏幕设备
B. 移动设备
C. 台式电脑
D. 笔记本电脑

38. Bootstrap的网格系统中， .col-xs-类是针对小屏幕设备，即屏幕宽度小于768px的。（1 分）

A. 正确
B. 错误

39. JavaScript中的数组元素可以直接通过其索引来访问。（1 分）

A. 正确
B. 错误

40. 在以下这个语句中的viewport表示屏幕的（）。＜meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"〉（2 分）

A. 可视区域
B. 总大小
C. 指定元素的大小
D. 指定元素的可见大小

41. DOM结构中，属性节点也有子节点。（1 分）

A. 正确
B. 错误

42. 当元素失去焦点时是触发onselect事件。（1 分）

A. 正确
B. 错误

43. 关于以下语句中的initial-scale表示的是（）＜meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"＞。（2 分）

A. 允许用户的最小缩放值
B. 允许用户的最大缩放值
C. 是否允许用户进行缩放操作
D. 页面的初始缩放值

44. JavaScript中typeof(true)的值是（）（2 分）

A. boolean
B. number
C. string
D. object

45. JavaScript中函数的定义使用关键字（）（2 分）

A. var
B. function
C. object
D. new

46. 下列关于JavaScript标识符的说明，不正确的是（）（2 分）

A. JavaScript中的标识符不区分大小写
B. JavaScript中尽量不要使用预定义的保留字做标识符
C. JavaScript中的标识符必须由字母、下划线、美元号等符号开头
D. JavaScript中的标识符中不能出现预定义的运算符

47. +符号在JavaScript中既可以表示算术加法，也可以表示字符串连接的操作。（1 分）

A. 正确
B. 错误

48. 下列选项中关于JavaScript浏览器对象中history对象的说法错误的是（）。（2 分）

A. history对象记录了用户在一个浏览器中已经访问过的URLs
B. history对象的父对象是JavaScript浏览器对象的根对象window
C. 应用history对象的方法可以实现IE浏览器中"前进”和"后退”按钮的功能
D. 应用history对象的back()方法相当于"前进”按钮，forward()方法相当于"后退”按钮

49. 下面哪个不属于DOM的节点类型（）（2 分）

A. 属性
B. 文本
C. 元素
D. 窗口

50. 下面哪个不属于JavaScript的优点（）。（2 分）

A. 跨平台
B. 开发简单
C. 多线程运行
D. 便于移植

51. 媒体查询条件中，如果要指定只适用于某种设备或情形，可以用关键字（）（2 分）

A. not
B. only
C. and
D. but

52. Flex布局比较适合用于小规模的布局，比如应用程序中的组件布局。（1.5 分）

A. 正确
B. 错误

53. 若字符串mystring的值是"I am a student"，则JavaScript代码mystring.ｃharAt(9)的输出结果是（）。（2 分）

A. I an a st
B. u
C. udent
D. t

54. Bootstrap网页中可使用（）类使图片水平居中显示。（2 分）

A. .img-responsive
B. .center-text
C. .center
D. .center-block

55. 流式布局与固定布局的最大不同点在于定义网页布局元素宽度时使用（）。（2 分）

A. 厘米
B. 相对大小单位
C. 像素
D. 百分比

56. "自适应”网站的缺点在于（）（2 分）

A. 可以极大地保证不同环境下的显示效果
B. 在网站维护时需要同时兼顾多个不同版本的网页
C. 维护的工作将会呈几何级数上升
D. 大大地增加架构设计的复杂度

57. Bootstrap中下列哪个类起巨幕显示的作用？（）（2 分）

A. page-header
B. jumbotron
C. badge
D. thumbnail

58. 要使浏览器返回前一个页面，可以使用BOM中history对象的（）语句。（2 分）

A. history.back()
B. history.forward()
C. history.go(-1)
D. history.assign(-1)

59. 媒体查询特性中，（）定义输出设备中的屏幕方向。（2 分）

A. device- height
B. device- width
C. orientation
D. resolution

60. 根据以下语句，如果当前屏幕尺寸不超过320像素时，将自动匹配（）这个图像。＜img src=“img /img/1_1280.jpg” srcset =“img/1_1280.jpg 1280w, img/1_640.jpg 640w,img/1_320.jpg 320w”/＞（2 分）

A. 1_1280.jpg
B. 1_640.jpg
C. 1_320.jpg
D. 以上均不能匹配

61. 响应式网页的核心思想，在于“ 一次设计，普遍适用”。（1 分）

A. 正确
B. 错误

62. JavaScript中关于BOM对象模型的结构，下面说法正确的是（）（2 分）

A. location、history等都是window对象的子对象
B. window、frames、navigator等顶级对象产生于浏览器载入文档至关闭期间的不同阶段
C. location对象保存正在浏览文档的位置及协议、端口、路径等构成信息
D. window对象在层次中最上层

63. 在Bootstrap网格布局系统中，如果一行（.row）中包含的列（.column）大于12，多余的列所在的元素将被作为一个整体另起一行排列。（1 分）

A. 正确
B. 错误

64. 如果直接使用默认的Bootstrap样式，则不需要调用以下的（）文件。。（2 分）

A. bootstrap.min.css
B. jquery-1.11.1.min.js
C. bootstrap.min.js
D. bootstrap.min.html

65. JavaScript中getElementById是对象window的方法。（1.5 分）

A. 正确
B. 错误

66. JavaScript中Math.floor(3.6)的结果是( )（2 分）

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

67. css中的1px都等于显示设备的1px。（1 分）

A. 正确
B. 错误

68. Bootstrap中，若为图片添加对（）类的调用，可以让图像显示为圆角矩形。（2 分）

A. .img-rounded
B. .img-responsive
C. .img-circle
D. .img-thumbnail

69. Bootstrap的源码是基于CSS 预处理脚本Less和 Sass开发的，支持响应式设计。（1.5 分）

A. 正确
B. 错误

70. Math对象的方法可以直接通过Math对象调用。（1 分）

A. 正确
B. 错误

71. 在Bootstrap网页的标题内还可以添加（）类的元素，可以用来标记副标题。（2 分）

A. .mark
B. .h2
C. .small
D. .jumbotorn

72. 媒体查询条件中，如果要指定适用于多个条件，可以用关键字all来连接。（1.5 分）

A. 正确
B. 错误

73. Bootstrap的网格系统类中，（）是对应于小屏幕宽度(大于等于768px且小于992px)的设备。（2 分）

A. .col-xs-
B. .col-sm-
C. .col-md-
D. .col-lg-

74. 任何时候JavaScript都可以自动进行类型转换，所以不需要用强制类型转换。（1 分）

A. 正确
B. 错误

75. Math对象的方法可以直接通过Math对象调用。（1.5 分）

A. 正确
B. 错误

76. JavaScript中通过数组的（）属性可获取其当前长度。（2 分）

A. name
B. id
C. length
D. prototype

77. 下列关于JavaScript中switch的描述，正确的是（）（2 分）

A. default语句是可以省略的
B. 每个case必须包含break语句
C. 至少应有一个case字句必须包含break
D. case语句的数量是有限制的

78. 以下不属于"自适应”网站的缺点的是（）（2 分）

79. 自适应网页强调"一次设计，普遍适用”。（1 分）

A. 正确
B. 错误

80. 下面关于JavaScript中函数的说法不正确的是（）（2 分）

A. 对于要重复使用的一段代码，最好将其编写为一个函数
B. 既可以使用预定义的函数，也可以使用自定义的函数
C. 函数可提高程序的可重用性
D. 在JavaScript中定义函数时必须指定返回值类型

81. 在DOM对象模型中，直接父对象为根对象window的对象中不包括（）。（2 分）

A. history
B. document
C. location
D. form

82. 下列哪个是合法的JavaScript标识符（）（2 分）

A. 3+s
B. 7_s
C. a$c
D. 12$

83. 如果要设置函数tick()每隔2秒执行一次，则正确的代码应为（）。（2 分）

A. setInterval(tick,1000)
B. setInterval（"tick()",2000）
C. setTimeout（"tick()",2000）
D. setTimeout(tick,2000)

84. 当打开浏览器窗口时，将创建window对象的实例。（1.5 分）

A. 正确
B. 错误

85. 在Boot中使用徽章只需要把 span class="（）" 添加到链接。（2 分）

A. badge
B. nav
C. glyphicon
D. pre

86. JavaScript脚本的扩展名为（）（2 分）

A. html
B. js
C. txt
D. css

87. Bootstrap中，通过对表格调用类（）可以让＜tbody>下的表格悬停鼠标指针实现背景效果。（2 分）

A. .table-hover
B. .table-responsive
C. .table-condensed
D. table-striped

88. Bootstrap提供了压缩版（生产版）与未压缩版（开发版）两种形式的压缩包。（1 分）

A. 正确
B. 错误

89. 在Bootstrap中，网格布局的容器必须先定义为（）类。。（2 分）

A. .container
B. .column
C. .row
D. div

90. 以下HTML代码定义的媒体查询条件下，如果设备的屏幕方向为横向，则页面背景颜色为（）ｂody { ｂackground-color:silver ; } ＠media only screen and (orientation: landscape) { ｂody { ｂackground-color: lightblue; } } （2 分）

A. 银色
B. 红色
C. 蓝色
D. 浅蓝色

91. 当打开浏览器窗口时，将创建window对象的实例。（1 分）

A. 正确
B. 错误

92. 响应式网页往往包含多个（）语句，用于适配不同的显示条件。（2 分）

A. 多媒体
B. 网格
C. 媒体查询
D. 地址跳转

93. history对象主要用于跟踪浏览器最近访问的历史URL地址列表。（1 分）

A. 正确
B. 错误

94. JavaScript中如果要实现鼠标分别移入及移开指定区域时的图片轮换效果，可绑定（）事件。（2 分）

A. onmouseover
B. onmouseup
C. onmouseup和onmouseout
D. onmouseover和onmouseout

95. JavaScript中使用下面哪个方法将返回单个对象（）（2 分）

A. getElementById
B. getElementsByTagName
C. getElementsByName
D. childNodes

96. 响应式网页对不同的使用环境可做出相应的自动调整，从而造成网页的布局和内容展示在不同环境下时可能会有所不同。（1 分）