前端程序员面试分类真题3

前端程序员面试分类真题3一、单项选择题1.

不能作为meta元素中的name属性值的选项是______A.descriptionB.keywordC.authorD.viewport参考答案（江南博哥）：B[考点]HTML元素元数据[解析]meta元素可以用name属性表示文档级元数据，在name属性中有个叫keywords的值，用于定义文档的多个关键字。由于选项B少了个字母“s”，因此，它是一个错误的属性值。name属性可用的关键字如下表所列。name属性中的关键字关键字描述application-nameWeb应用程序的名称author文档的作者description对文档内容的描述(可以言简意赅)generator标识生成页面的工具名，有些内容管理系统可以自动生成页面keywords定义文档关键字，多个关键字可用逗号分隔robots规定搜索引擎如何操纵该文档，例如noindex(禁止索引文档)、noarchive(禁止缓存文档内容)等viewport主要用于移动设备，可设置浏览器中的视口(viewport)

2.

某个页面被嵌入在iframe元素中，并且页面中有个a元素。将a元素的target属性设为下面______关键字后，可在新窗口中显示链接的资源A._selfB._blankC._parentD.top正确答案：B[考点]HTML元素超链接和图像[解析]target属性用于指定在何处显示链接的资源，有4个关键字可选。选项A中的_self表示当前窗口；选项B中的_blank表示新窗口；选项C中的_parent表示父窗口，当没有父窗口的时候，与_self的效果相同；选项D中的_top表示顶层窗口，如果已经是顶层窗口，那么与_self的效果相同。只有选项B中的关键字才会在新窗口中显示链接的资源。

3.

以下图像格式支持alpha透明的是______A.GIFB.PNGC.JPEGD.BMP正确答案：B[考点]HTML元素超链接和图像[解析]alpha透明是指使用alpha通道实现的透明。虽然选项A中的GIF格式也能实现透明效果，但并不是alpha透明。

4.

下面的选项都是input元素的type属性值，其中HTML5新增的是______A.hiddenB.textC.passwordD.tel正确答案：D[考点]HTML元素表单和表格[解析]选项D是HTML5新增的type属性值，它可以输入电话号码格式的文本，但不会强制执行特定的验证机制，这是因为电话号码的规则众多。选项A中的hidden表示隐藏元素，可存储不让用户看见和编辑的数据。选项B中的text只能输入单行文本，并且文本中的换行符会自动移除。选项C中的password可遮盖单行文本，一般用于输入密码。

5.

HTML5为input元素新增了多个提交相关的属性，以下选项属于这一类属性的是______A.formactionB.enctypeC.methodD.novalidate正确答案：A[考点]HTML元素表单和表格[解析]HTML5新增了6个提交相关的属性，选项A中的formaction正是这6个属性中的一个。除了form属性之外，其余的都用于覆盖表单的对应属性(对应关系如下表所列)，这个表单是指包含此元素的表单或关联的表单。提交相关的属性HTML5新增的属性表单的属性formactionactionformenctypeenctypeformmethodmethodformtargettargetformnovalidatenovalidate

6.

以下用来关联表头的单元格属性是______A.colspanB.rowspanC.headersD.valign正确答案：C[考点]HTML元素表单和表格[解析]单元格元素都有headers属性，通过定义一个或多个th元素的id属性来关联表头，有助于设备对表格的处理。选项A中的colspan用于合并列，选项B中的rowspan用于合并行，选项D中的valign是一个过时的属性，可让单元格中的内容垂直对齐。

7.

在以下iframe元素的属性中，用于设置嵌入文档安全规则的是______A.seamlessB.sandboxC.scrollingD.src正确答案：B[考点]HTML元素iframe[解析]选项A中的布尔属性seamless可让iframe元素中引用的文档成为父文档的一部分。选项B中的sandbox属性用于指定嵌套内容的安全规则，也就是对内嵌文档中的插件、表单、脚本、链接等进行限制，保证文档浏览的安全性。选项C中的scrolling属性用于指示内嵌文档显示滚动条的时机。选项D中的src属性可设置内嵌文档的URL地址。

8.

以下专门用于播放音频的元素是______A.videoB.sourceC.trackD.audio正确答案：D[考点]多媒体和绘图[解析]HTML5新增的多媒体元素有video、audio、source和track。选项D中的audio专门用于播放音频；选项A中的video元素专门用于播放视频；另外两个选项中的source和track都是video和audio的子元素，前者能同时指定多个格式的多媒体文件，后者能为多媒体文件添加辅助文本信息。

9.

下面对位图图像描述错误的是______A.由点和线组成B.常用于数码照片C.特点是色彩变化丰富D.当无限放大时，图像会失真正确答案：A[考点]多媒体和绘图[解析]位图图像(bitmapimage)又称栅格图(rastergraphics)，它的特点是色彩变化丰富，可逼真地再现世界，因此常用于数码照片、页面效果图等。位图图像由像素矩阵组成，也就是由无数个像素点组成，它并不是由点和线组成，因此，选项A不正确。

10.

下面对矢量图形描述错误的是______A.由无数个像素点组成B.色彩比较简单C.常用于三维建模D.当放大的时候，不会影响清晰度正确答案：A[考点]多媒体和绘图[解析]矢量图形(vectorgraphics)由点和线组成，把点看成是一个坐标，在两个点之间用曲线或直线连接，可以组成任何形状。与位图相比，色彩比较简单，无法表现逼真图像，但是当放大、缩小或旋转的时候，不会丢失细节，也不会影响清晰度(即不失真)，常用于三维建模、特殊字体、图标和logo等。由此可知，矢量图形并不是由无数个像素点组成的，选项A的描述并不准确。

二、多项选择题1.

通过元素的事件属性嵌入的脚本如以下代码所示，它的缺点是______

＜inputtype="button"onclick="print()"/＞A.不可复用B.不能用于复杂的函数声明C.可读性低D.不能实时调试正确答案：ABC[考点]HTML元素元数据[解析]事件属性都是以on为前缀的。用这种方式嵌入脚本，比较便于在网页中实时调试，可立刻看到效果。不过它的缺点也很多，下面列出了三点。

(1)不可复用，如果有100个元素需要绑定点击事件，那么就需要写100遍元素。

(2)由于属性值是字符串，所以内容应该是执行函数、对象方法或简单的逻辑，不能用于复杂的函数声明、创建对象等，局限性比较大。

(3)虽然可以用分号分割多条语句，但是一旦代码量增长，可读性就会降低。

由此可知，除了选项D之外，其余3个选项都是事件属性的缺点。

2.

在以下a元素的href属性中，使用“javascript:”伪协议实现的特殊功能有______A.禁止元素的默认行为B.调用函数C.制作浏览器书签D.声明函数正确答案：ABC[考点]HTML元素元数据[解析]选项A中的效果只需为href属性设置特定的值就能实现，例如“javascript:void(0);”。void是JavaScript的运算符，会忽略计算结果返回undefined。href属性嵌入的脚本只能实现简单的函数调用，不可用于函数声明，因此选项B正确，而选项D不正确。直接将JavaScript代码填写在地址栏中会被浏览器过滤，但如果将代码做成书签的话，就能顺利执行。在Firefox中，右击链接就能实现选项C中的效果，制作出浏览器书签。

3.

meta元素的name属性定义为viewport后，在content属性中定义的关键字可以是______A.widthB.initial-scaleC.maximum-scaleD.user-scalable正确答案：ABCD[考点]HTML元素元数据[解析]首先了解一下视口的概念。视口是指不包括浏览器外壳(如标签页、书签栏、调试工具等)的窗口，也就是文档内容的可视区域。下中用粗线框住的是浏览器的外壳部分，剩下的灰色区域就是视口。

浏览器界面

设置viewport的目的是让HTML文档在小尺寸的屏幕上正确显示。属性值可包括多个键值对，具体如下表所列。content属性的键值对关键字描述值width视口的宽度device-width(设备宽度)或确切的像素数(例如500)initial-scale视口初始缩放级别0～10之间的正数，1表示无缩放，值越小，页而越精细maximum-scale视口能缩放的最大值0～10之间的正数minimum-scale视口能缩放的最小值0～10之间的正数user-scalable是否可以手动缩放yes或no

4.

meta元素的http-equiv属性所拥有的功能包括______A.定义MIME类型与字符编码B.指定首选样式表C.执行重载或重定向D.缩放视口正确答案：ABC[考点]HTML元素元数据[解析]http-equiv属性提供了一些程序指令，用于模拟HTTP首部，每个http-equiv属性值会对应特定的content属性值。在http-equiv属性中包含三个关键字，分别是content-type、default-style和refresh，对应的效果分别是选项A、选项B和选项C。而选项D中的效果需要通过把name属性设为viewport后才能实现。

5.

以下对a元素功能的描述中，正确的是______A.导航到其他网站B.拨打电话C.发送短信D.发送邮件正确答案：ABCD[考点]HTML元素超链接和图像[解析]a元素用于生成超链接，超链接可帮助用户导航到其他网页、文件或位置。它的href属性可以设为浏览器支持的任何协议的URL，因为有这个特点，a元素也可用于手机拨号、发送短信、发送邮件等功能。当发送短信的时候，可将内容作为参数直接带过去；当发送邮件的时候，可将收件人、抄送人、主题和内容作为参数直接带过去，代码如下所示。

＜ahref="tel:10086"＞拨打电话＜/a＞

＜ahref="sms:10086?body=test"＞发送短信＜/a＞

＜ahref="mailto:strick@?cc=jane@"＞发送邮件＜/a＞

6.

在下面的选项中，属于a元素的属性有______A.downloadB.hreflangC.actionD.src正确答案：AB[考点]HTML元素超链接和图像[解析]选项A中的download是HTML5新增的属性，指定下载资源，该属性需要与href属性组合使用。选项B中的hreflang用于定义链接资源所使用的语言，仅仅是提示，没有特殊功能。选项C中的action存在于form元素中，用于指定表单提交的地址。选项D中的src存在于img元素中，用于指定图像的URL。

7.

HTML5去除了img元素的一些过时属性，包括下面的______A.alignB.crossoriginC.borderD.usemap正确答案：AC[考点]HTML元素超链接和图像[解析]HTML5去除了img元素的一些过时属性，包括align、border、hspace、vspace和name，保留和添加了多个实用属性。选项A和选项C中的两个属性都能改变img元素的呈现，即可以设置元素的样式。在HTML5中，已规定不能再使用这类属性。选项B中的crossorigin可帮助图像实现跨域。选项D中的usemap可让图像关联分区响应图(即热点区域)，也就是图像上的部分位置有超链接。引用的方式是通过“#”和map元素的name或id属性拼接在一起，例如“#area”。

8.

每张表格都需要包含几个元素，这些元素是______A.tableB.trC.tdD.tbody正确答案：ABC[考点]HTML元素表单和表格[解析]表格(table)用于以网格的形式呈现二维数据，它基于行(tr)和单元格(td)组建而成，因此必须包含这3个元素才能实现表格的效果。

9.

在下面的选项中，哪些是iframe的用途______A.嵌入第三方内容B.长轮询C.跨域通信D.无刷新文件上传正确答案：ABCD[考点]HTML元素iframe[解析]iframe元素能把一个文档嵌入到另一个文档中，并且能让两个文档保持独立。利用这个特点可以实现4个选项中的功能。

10.

多媒体元素video专门用于播放视频，它的属性包括______A.autoplayB.preloadC.controlsD.poster正确答案：ABCD[考点]多媒体和绘图[解析]4个选项都是video元素的属性，autoplay可指定视频在页面载入后就能自动播放；preload表示是否预先载入视频；controls用于显示播放控件；poster可指定视频的封面照。

三、简答题1.

input元素中的form属性有什么作用?正确答案：form属性是HTML5的新增属性，用于关联某个form元素。以往input元素需要放在form元素之内，定义了form属性后，就可以放在文档的任何位置了，代码如下所示。

＜!--form元素内--＞

＜formid="info"method="post"＞

＜inputtype="text"/＞

＜/form＞

＜!--关联id为info的form元素--＞

＜inputtype="text"form="info"/＞[考点]HTML元素表单和表格

2.

元素的布尔属性disabled和readonly有什么区别?正确答案：可参考下表中的对比。表中第三列的元素操作是指读取、写入等操作，第五列中的Tab导航是指能否用Tab键定位到该元素。disabled和readonly的对比属性元素外观元素操作获取焦点Tab导航表单提交元素支持disabled修改否否否没有发送数据input、textarea、option、select和button等元素readonly维持是是是会发送数据input和textarea[考点]HTML元素表单和表格

3.

HTML5已废弃控制样式的属性，请列举几个这样的table元素属性，并用合适的CSS属性替代。正确答案：align属性表示表格在文档中的对齐方式(不是单元格内容的对齐方式)，可用CSS属性margin来替代；cellpadding属性用于指定单元格内边距(不是表格内边距)，可用CSS属性padding替代；cellspacing属性表示单元格之间的间隙，可用CSS属性border-spacing替代。[考点]HTML元素表单和表格

4.

请列举表格布局的弊端。正确答案：表格布局主要有以下5方面的弊端。

(1)可访问性差。表格布局中的内容从左到右和从上到下的读取并不总是有意义，