计算机二级考试web程序设计练习题及答案_第1页
计算机二级考试web程序设计练习题及答案_第2页
计算机二级考试web程序设计练习题及答案_第3页
计算机二级考试web程序设计练习题及答案_第4页
计算机二级考试web程序设计练习题及答案_第5页
已阅读5页，还剩25页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

计算机二级考试web程序设计练习题及答案1.单项选择题(1)下列关于HTML5文档基本结构的说法，正确的是哪一项？A.`<head>`标签必须放在`<html>`标签之前B.`<!DOCTYPE>`声明必须位于HTML文档的第一行，不属于HTML标签C.所有HTML元素都必须有闭合标签D.meta标签必须定义网页标题答案：B解析：`<html>`是HTML文档的根标签，所有页面内容都必须嵌套在`<html>`标签内部，因此`<head>`不可能放在`<html>`之前，A选项错误；HTML5规范中允许单标签不闭合，例如`<img>`、`

`、`<meta>`等，C选项错误；网页标题由`<title>`标签定义，meta标签用于定义页面元数据，例如字符编码、关键字、视口属性等，D选项错误；`<!DOCTYPE>`声明用于告知浏览器当前HTML文档的版本，必须放在文档第一行，不属于HTML标签，B选项正确。(2)在HTML中，想要让用户输入密码内容，输入框内容不可见，以下input类型正确的是？A.`type="text"`B.`type="password"`C.`type="hidden"`D.`type="file"`答案：B解析：type="text"是明文单行文本输入框，输入内容可见；type="hidden"是隐藏域，用于存储页面不展示的数据，不会显示在页面中；type="file"是文件上传控件，用于选择本地文件，因此只有B选项符合要求。(3)在CSS中，下列选择器优先级从高到低排序正确的是？A.内联样式>ID选择器>类选择器>标签选择器B.ID选择器>内联样式>类选择器>标签选择器C.内联样式>类选择器>ID选择器>标签选择器D.标签选择器>类选择器>ID选择器>内联样式答案：A解析：CSS优先级的计算规则为：内联样式优先级为1000，ID选择器优先级为100，类选择器、伪类选择器、属性选择器优先级为10，标签选择器优先级为1，继承样式优先级最低，因此排序为内联样式>ID选择器>类选择器>标签选择器，A选项正确。(4)标准W3C盒模型中，一个块级元素的自身总宽度计算方式正确的是？A.总宽度=content宽度+padding+border+marginB.总宽度=content宽度+padding+borderC.总宽度=content宽度D.总宽度=content宽度+margin答案：B解析：标准W3C盒模型中，元素设置的width属性仅对应content内容区域的宽度，padding和border在content宽度之外计算，因此元素自身的总宽度为content宽度加上左右padding、左右border，margin是元素与外部其他元素的间距，不属于元素自身宽度，因此B选项正确；IE怪异盒模型中，设置的width包含content、padding和border，与标准盒模型不同。(5)以下哪个CSS属性可以清除元素两侧的浮动，解决浮动带来的高度塌陷问题？A.`clear:both`B.`overflow:hidden`C.`float:none`D.`display:block`答案：A解析：clear属性的作用是规定元素的哪一侧不允许出现浮动元素，`clear:both`表示左右两侧都不允许存在浮动元素，因此可以实现清除浮动的效果；`overflow:hidden`可以通过触发BFC间接解决高度塌陷，但本身不是清除浮动的专用属性，题目问的是核心清除浮动属性，因此A选项正确。(6)在JavaScript中，以下不属于基本数据类型的是？A.StringB.NumberC.ObjectD.Undefined答案：C解析：JavaScript的所有数据类型分为两类，基本数据类型和引用数据类型，其中基本数据类型包括String、Number、Boolean、Undefined、Null、Symbol、BigInt，Object、Array、Function都属于引用数据类型，因此C选项符合要求。(7)以下代码执行后，控制台输出的结果是？```vara=10;functiontest(){console.log(a);vara=20;}test();```A.10B.20C.undefinedD.报错答案：C解析：本题考核JavaScript变量提升的规则，函数内部使用var声明的变量会提升到函数作用域的顶部，但是仅提升声明，不会提升赋值，因此执行`console.log(a)`时，函数内部的a已经声明但未赋值，因此输出undefined，不会访问全局作用域的a，C选项正确。(8)在HTTP请求方法中，用于请求获取服务器上指定资源的方法是？A.POSTB.GETC.PUTD.DELETE答案：B解析：GET方法用于从服务器获取指定资源，参数会拼接在URL中；POST方法用于向服务器提交数据；PUT方法用于向服务器上传指定资源；DELETE方法用于删除服务器上的指定资源，因此B选项正确。(9)当用户访问一个不存在的网页资源时，服务器返回的标准HTTP状态码是？A.200B.301C.404D.500答案：C解析：200表示请求成功；301表示永久重定向；404表示资源未找到，对应用户访问不存在的网页场景；500表示服务器内部错误，因此C选项正确。(10)Bootstrap3/4的栅格系统中，默认将一行容器分为多少列？A.8B.12C.16D.24答案：B解析：Bootstrap栅格系统默认将一行分为12等份，开发人员可以通过给元素添加不同的类名，让元素占据不同的列数，实现响应式布局，例如`col-md-6`表示中等屏幕下元素占据6列，也就是容器一半宽度，因此B选项正确。(11)以下哪个标签是HTML5中新增的语义化标签，专门用于定义页面的导航部分？A.`<header>`B.`<nav>`C.`<footer>`D.`<article>`答案：B解析：HTML5新增了多个语义化标签，其中`<header>`定义页面或区块的头部，`<nav>`定义页面的导航区块，`<footer>`定义页面或区块的底部，`<article>`定义页面中独立的内容区块，因此B选项正确。(12)在CSS中，想要让一个宽度固定的块级元素在父元素中水平居中，以下写法正确的是？A.`text-align:center`B.`line-height:center`C.`margin:0auto`D.`padding:0auto`答案：C解析：`text-align:center`的作用是让块级元素内部的行内内容（文本、行内元素）水平居中，不能让块级元素自身居中；`margin:0auto`表示上下外边距为0，左右外边距自动平分，因此块级元素会在父元素中水平居中，C选项正确。(13)JavaScript中，以下哪个方法可以用于在数组的末尾添加一个元素，并返回数组的新长度？A.`push()`B.`pop()`C.`unshift()`D.`shift()`答案：A解析：`push()`：在数组末尾添加元素，返回数组新长度；`pop()`：删除数组末尾的元素，返回被删除的元素；`unshift()`：在数组开头添加元素，返回数组新长度；`shift()`：删除数组开头的元素，返回被删除的元素，因此A选项正确。(14)JavaScript中，表达式`Boolean(0)+Boolean('')+Boolean(null)`的运行结果是？A.0B.1C.3D.NaN答案：A解析：JavaScript中，0、空字符串、null、undefined、NaN都属于假值，转换为Boolean类型结果都是false，false隐式转换为数字类型结果是0，因此表达式的结果为`0+0+0=0`，A选项正确。(15)以下关于CSS定位的说法，错误的是？A.static是默认的定位方式，元素按照正常文档流排列B.relative相对定位是相对于元素原本的位置进行偏移，不脱离文档流C.absolute绝对定位是相对于最近的非static定位父元素偏移，脱离文档流D.fixed固定定位是相对于父元素固定，滚动页面时位置不会变化答案：D解析：fixed固定定位是相对于浏览器视口（可视区域）固定，无论页面怎么滚动，元素都会保持在视口的固定位置，不是相对于父元素固定，因此D选项说法错误，符合题目要求。2.操作题(1)基本操作题请完善HTML文件`index.html`中的代码，实现如下要求：①设置网页的字符编码为UTF-8，网页标题为“个人主页”；②在网页body中插入一张头像图片，图片路径为`images/avatar.jpg`，替换文本为“头像”，图片宽高均为200px；③给图片添加超链接，点击图片打开邮件客户端，发送邮件到`example@`。原代码框架如下，补充缺失部分的代码：```<!DOCTYPEhtml><html>/*缺失代码区域1*/<title>/*缺失代码区域2*/</title></head><body><!--缺失代码区域3--></body></html>```参考答案：补充后完整代码如下：```<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>个人主页</title></head><body><ahref="mailto:example@"><imgsrc="images/avatar.jpg"alt="头像"width="200"height="200"></a></body></html>```考点解析：本题考核HTML基础结构、meta标签、超链接协议、图片标签的基础用法，其中`mailto:`协议用于指定超链接打开本地邮件客户端，是计算机二级Web基本操作题的高频考点；alt属性是图片的必填属性，用于图片加载失败时显示替换文本，符合HTML规范要求。(2)简单应用题现有商品列表页面，已经编写好基础HTML结构，要求补充CSS代码实现如下效果：①页面所有元素清除浏览器默认的内外边距，统一设置盒模型为`border-box`，即元素设置的width包含padding和border；②商品列表使用无序列表实现，去除列表默认的项目符号，每个商品左浮动，宽度为300px，外边距为10px；③商品价格文字设置为红色，字体大小18px，加粗显示；④清除浮动，避免父元素高度塌陷。原代码框架如下，补充CSS部分代码：```<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>商品列表</title><styletype="text/css">/*补充CSS代码区域*/</style></head><body><ulclass="goods-list"><liclass="goods-item"><imgsrc="goods1.jpg"alt="商品1"><pclass="price">¥99</p></li><liclass="goods-item"><imgsrc="goods2.jpg"alt="商品2"><pclass="price">¥199</p></li><liclass="goods-item"><imgsrc="goods3.jpg"alt="商品3"><pclass="price">¥129</p></li></ul></body></html>```参考答案：补充后的完整CSS代码如下：```*{margin:0;padding:0;box-sizing:border-box;}.goods-list{list-style:none;overflow:hidden;/*清除浮动，解决高度塌陷*/}.goods-item{float:left;width:300px;margin:10px;}.price{color:#ff0000;font-size:18px;font-weight:bold;}```考点解析：本题考核CSS全局样式重置、盒模型属性、浮动布局、列表样式、文本样式的用法。`box-sizing:border-box`是CSS3新增属性，可以简化宽高计算，是二级Web考试的常考内容；浮动元素脱离文档流后会导致父元素高度塌陷，通过给父元素设置`overflow:hidden`触发BFC，撑开父元素高度，是常用的解决方法，符合考试要求。(3)综合应用题要求实现一个简易计算器功能，支持两个数的加减乘除运算，需求如下：①页面提供两个文本输入框，供用户输入两个运算数；②提供四个按钮，分别对应加、减、乘、除四种运算，点击按钮触发运算；③运算结果展示在页面指定区域，如果输入不是合法数字，或除法运算除数为0，给出对应错误提示。原代码框架如下，补充JavaScript部分的代码：```<!DOCTYPEhtml><html><head><metacharset="utf-8"><style>.calculator{width:300px;margin:50pxauto;padding:20px;border:1pxsolid#eee;}.input-group{margin:15px0;}input{width:100%;padding:8px;margin-top:5px;}button{width:24%;padding:8px;margin:5px0;cursor:pointer;}margin-top:20px;padding:10px;border:1pxsolid#ddd;min-height:20px;}</style></head><body><divclass="calculator"><h3>简易计算器</h3><divclass="input-group"><label>第一个数：</label><inputtype="text"id="num1"></div><divclass="input-group"><label>第二个数：</label><inputtype="text"id="num2"></div><divclass="btn-group"><buttononclick="calc('add')">加</button><buttononclick="calc('sub')">减</button><buttononclick="calc('mul')">乘</button><buttononclick="calc('div')">除</button></div><divid="result">运算结果：</div></div><scripttype="text/javascript">functioncalc(type){//补充代码区域}</script></body></htm

人人文库> 全部分类> 行业资料 > 各类标准

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论