2019阿里前端工程师面试题和答案解

一、单选题（共21题，每题5分）

1.为每一个指定元素的指定事件（像click）绑定一个事件处理器函数，下面哪个是用来实现该功能的？

A、trigger (type)

B、bind(type)

C、one(type)

D、bind

参考答案：B

答案解析：暂无

2.哪一个html盒模型中的border的正确写法？

A、p{ border:5px solid red;}

B、p{border:5px <br> red solid; }

C、p{border: red solid 5px; }

D、p{border: solid red 5px; }

参考答案：A

答案解析：为了代码的可读性，建议按照，border-width，border-style，border-color，的顺序书写。

但其实顺序调换是不影响呈现的

3.关于适配器模式，说法错误的是？

A、适配器继承或依赖已有的对象，实现想要的目标接口

B、主要解决在软件系统中，常常要将一些"现存的对象"放到新的环境中，而新环境要求的接口是现对象不能满足的

C、定义了算法家族，分别封装起来，让他们之间可以相互替换，此模式让算法的变化不会影响到使用算法的客户

D、将一个类的接口转换成客户希望的另外一个接口。适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。

参考答案：C

答案解析：将一个类的接口转换成客户希望的另外一个接口。适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作适配器继承或依赖已有的对象，实现想要的目标接口主要解决在软件系统中，常常要将一些"现存的对象"放到新的环境中，而新环境要求的接口是现对象不能满足的

4.以下几种在HTML文档中通过CSS的方式将文档颜色设置为红色背景错误的是：（）

A、内联样式表：<body style=”background-Color:red”></body>

B、嵌入样式表：<style> body { background-Color:red } </style>

C、外部样式表：在当前目录下创建一个test.css文件，在文件中声明一条<style> body { background-Color:red } </style>代码，并在HTML文档中通过<link style=”text/css” rel=”stylesheet” href=”test.css”>将其链接到本文档中使用

D、输入样式表：在当前目录下创建一个test.css文件，在文件中声明一条body { background-Color:red } 代码，并在HTML文档中通过<style>@import url(test.css);</style>输入到本文档中使用

参考答案：C

答案解析：暂无

5.在 HTML5 中，哪个方法用于获得用户的当前位置？

A、getPosition()

B、getCurrentPosition()

C、getUserPosition()

D、getLocation()

参考答案：B

答案解析：getCurrentPosition（）获取用户当前位置放入一个值中保存，getLocation()地图定位

6.对于下拉菜单，错误的是？

pre class="prettyprint"><div class="dropdown"> <button class="btn btn-" tabindex="-1">Separated link</a></li>

defaultdropdowtoggle" data-toggle="dropdown" id="dropdownMenu1" type="button">

Dropdown

</button>

<ul aria-labelledby="dropdownMenu1" class="dropdown-menu" role="menu"><li role="presentation"><#" role="menuitem" tabindex="-1">Action</a></li> <li r"presentation"><a href="#" role="menuitem" tabindex="-1">Anotheaction</a></li>

<li rolef="#" role="menuitem" tabindex="-1">Something else here</a></li>

<li role="presentation"><a href="#" role="menuitem" tabindex="-1">Separated link</a></li>

Dropdown

</button>

<ul aria-labelledby="dropdownMenu1" class="dropdown-menu" role="menu"><li role="presentation"><a href="#" role="menuitem" tabindex="-1">Action</a></li>

<li role="presentation"><a href="#" role="menuitem" tabindex="-1">Another action</a></li>

<li role="presentation"><a href="#" role="menuitem" tabindex="-1">Something else here</a></li>

<li role="presentation"><a href="#" role="menuitem

A、表示了一个有五个下拉选项的下拉菜单

B、<span class="caret"></span>可以去掉而不影响功能

C、可以加入pull-right使菜单右对齐

D、可加入dropdown-menu-right使菜单右对齐

参考答案：A

答案解析：这道题我一眼就看出A有错了，可是还是让我纠结了好久，怎么会有这么低级的问题，空城计吗

7.下面关于 CSS 布局的描述，不正确的是？（）

下面关于CSS布局的描述，不正确的是？（）

A、块级元素实际占用的宽度与它的 width 属性有关；

B、块级元素实际占用的宽度与它的 border 属性有关；

C、块级元素实际占用的宽度与它的 padding 属性有关；

D、块级元素实际占用的宽度与它的 background 属性有关。

参考答案：D

答案解析：D 块级元素实际占用的宽度=width+border*2+padding*2+margin*2 所以与width border padding margin有关，与background无关

8.以下JavaScript代码输出的结果是？

var a = '5' + 3var b = '5' - 3

console.log(a, b)

JavaScript

A、53, 2

B、8, 2

C、error

D、都不对

参考答案：A

答案解析：这是一道隐式类型转换的题加法：加法运算中，如果有一个操作值为字符串类型，则将另一个操作值转换为字符串，最后连接起来减法：如果操作值之一不是数值，则被隐式调用Number()函数进行转换所以第一行结果为字符串运算，为'53'。第二行结果为2，选A9.在jQuery中，有以下代码，以下说法正确的是？

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

var json = [{"S_Name": "周颜", "S_Sex": "男"}, {"S_Name": "周颖", "S_Sex": "女"}];

$.each(json, function (index, s) {

alert(s.S_Name + "," + s.S_Sex);//语句1

});});

JavaScript

A、此代码不会正常运行

B、语句1会被执行1次

C、语句1会被执行2次

D、$.each()函数的用法有误

10.虽然不同的操作系统可能装有不同的浏览器。但是这些浏览器都符合（）协议。

A、SNMP

B、 HTTP

C、HTML

D、SMTP

参考答案：B

答案解析：

简单网络管理协议（SNMP），由一组网络管理的标准组成，该协议能够支持网络管理

系统，用以监测连接到网络上的设备是否有任何引起管理上关注的情况。

HTTP协议（HyperText Transfer Protocol，超文本传输协议）是客户端浏览器或其他程序与WEB服务器之间的应用层通信协议。

超文本标记语言（HTML），标准通用标记语言下的一个应用，也是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。网页的本质就是超级文本标记语言，通过结合使用其他的Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。

SMTP（Simple Mail Transfer Protocol，简单邮件传输协议）,它是一组用于由源地址到目的地址传送邮件的规则，由它来控制信件的中转方式。SMTP协议属于TCP/IP协议簇，它帮助每台计算机在发送或中转信件时找到下一个目的地。

11.css属性position的值不包含

A、absolute

B、inherit

C、box

D、static

参考答案：C

答案解析：absolute，生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位；元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定； fixed，生成绝对定位的元素，相对于浏览器窗口进行定位；元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 relative，生成相对定位的元素，相对于其正常位置进行定位； static，默认值，没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）； inherit，规定应该从父元素继承 position 属性的值。.

12.以下全部属于块级标签的是？

A、<div><p><input><span><img>

B、<div><h1><p><img><dl>

C、<span><h1><p><img><dl>

D、<div><p><form><ul><h1>

参考答案：D

答案解析：

13.关于下面HTML代码，说法正确的是?

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table

HTML

A、该表格共有2行3列

B、该表格的边框宽度为10毫米

C、该表格中的文字均居中显示

D、"公司"单元格跨2行

14.基于哈希算法在信息安全中主要应用在？

(1) 文件校验

(2) 数字签名

(3) 鉴权协议

A、(1)(2)

B、(1)(3)

C、(2)(3)

D、(1)(2)(3)

参考答案：D

答案解析：Hash算法在信息安全方面的应用主要体现在以下的3个方面：（1)文件校验我们比较熟悉的校验算法有奇偶校验和CRC校验，这2种校验并没有抗数据篡改的能力，它们一定程度上能检测并纠正数据传输中的信道误码，但却不能防止对数据的恶意破坏。 MD5 Hash算法的"数字指纹"特性，使它成为目前应用最广泛的一种文件完整性校验和(Checksum)算法，不少Unix系统有提供计算md5 checksum的命令。（2)数字签名 Hash 算法也是现代密码体系中的一个重要组成部分。由于非对称算法的运算速度较慢，所以在数字签名协议中，单向散列函数扮演了一个重要的角色。对 Hash 值，又称"数字摘要"进行数字签名，在统计上可以认为与对文件本身进行数字签名是等效的。而且这样的协议还有其他的优点。（3) 鉴权协议如下的鉴权协议又被称作挑战--认证模式：在传输信道是可被侦听，但不可被篡改的情况下，这是一种简单而安全的方法。以上就是一些关于hash以及其相关的一些基本预备知识。

15.下面哪条声明能固定背景图片（）

A、background-attachment:fixed;

B、background-attachment:scroll;

C、background-origin: initial;

D、background-clip: initial;

参考答案：A

答案解析：

background-attachment

有三个值，scroll是默认值，背景图像会随着页面其余部分的滚动而移动。

fixed当页面的其余部分滚动时，背景图像不会移动。

inherit规定应该从父元素继承 background-attachment 属性的设置。

background-origin

属性规定 background-position 属性相对于什么位置来定位。

background-clip

属性规定背景的绘制区域。

16.以下选项不能够正确地得到这个标签：（）

A、 $("#btnGo")

B、 $(".btnGo")

C、 $(".btn")

D、 $("input[type='button']")

参考答案：B

答案解析：注意是题目是选不能

17.在jquery中想要实现通过远程http get请求载入信息功能的是下面的哪一下事件？

A、$.ajax()

B、load(url)

C、$.get(url)

D、$. getScript(url)

18.在进行面向对象设计时，采用设计模式能够（）。

A、复用相似问题的相同解决方案

B、改善代码的平台可移植性

C、改善代码的可理解性

D、增强软件的易安装性

19.标记符title是放在以下哪个标记符之间的？（）

A、html与html

B、head与head

C、body与body

D、head与body

参考答案：B

20.如果在 HTML 页面中包含如下图片标签，则选项中的（）语句能够实现隐藏该图片的功能。

A、document.getElementById(“pic”).style.display=”visible”;

B、document.getElementById(“pic”).style.display=”disvisible”;

C、document.getElementById(“pic”).style.display=”block”;

D、document.getElementById(“pic”).style.display=”none”;

参考答案：D

答案解析：D，display没有visible这个， visibility才有这个值

21.以下 jquery 对象方法中，使用了事件委托的是

A、bind

B、mousedown

C、click

D、change

E、on

参考答案：E

答案解析：

jQuery中实现事件委托的三种方法：

$.on: 基本用法:$('.parent').on('click', 'a', function () { console.log('click event on tag a'); })，它是 .parent 元素之下的 a 元素的事件代理到$('.parent')之上，只要在这个元素上有点击事件，就会自动寻找到.parent元素下的a元素，然后响应事件；

$.delegate: 基本用法:$('.parent').delegate('a', 'click', function () { console.log('click event on tag a'); })，同上，并且还有相对应的$.delegate来删除代理的事件；

$.live: 基本使用方法:$('a', $('.parent')).live('click', function () { console.log('click event on tag a'); })，同上，然而如果没有传入父层元素$(.parent)，那事件会默认委托到$(document)上；(已废除)

事件委托原理：

事件委托是通过事件冒泡的原理，利用父级去触发子级的事件。

如果不用事件委托，将ul下每一个li都去添加click事件监听，非常麻烦，而且对于内存消耗是非常大的，效率上需要消耗很多性能；

另外就是如果通过js动态创建的子节点，需要重新绑定事件。

而利用事件委托的话，只需要给父级绑定一个事件监听，即可让每个li都绑定上相应的事件，让你避免对特定的每个节点添加事件监听器；事件监听器是被添加到它们的父元素上。事件监听器会分析从子元素冒泡上来的事件，找到是哪个子元素的事件。

二、多选题（共9题，每题5分）

1.当元素的一个继承属性没有指定值时，则取父元素的同属性的计算值，以下哪些不是...

当元素的一个继承属性没有指定值时，则取父元素的同属性的计算值，以下哪些不是CSS中的继承属性？

A、color

B、display

C、border-style

D、text-align

参考答案：B,C

答案解析：

不可继承：display，margin，border，padding，background，height，width，position

2.在下面的标签中哪些是struts标签

A、html:form

B、html:text

C、html:errors

D、html:message

参考答案：A,B,C,D

答案解析：暂无

3.下面有关html结构描述正确的有？

A、<ul> <li> </li> </ul>

B、<ol> <li> </li> </ol>

C、<dl><dt><dd></dd></dt></dl>

D、<table> <tr> <td></td> </tr> </table>

参考答案：A,B,D

4.Ruby中，下面定义一个正则表达式正确的方法是（）

A、re = /\w+/

B、re = //usr/local?/etc/

C、re = %r{/usr/local?/etc}

D、re = Regexp.escape("usr/local/etc")

参考答案：A,C答案解析：暂无

5.哪些是正确的bootstrap辅助类

A、text-muted

B、text-success

C、text-info

D、text-warning

参考答案：A,B,C,D 。答案解析：.text-muted:文字的颜色换成灰色 /.text-primary:文字的颜色变成蓝色 / .text-success:文字的颜色变成绿色 /.text-info:文字的颜色变成暗蓝色 /.text-warning:文字颜色变成暗黄色 /.text-danger：文字的颜色变成红色

6.下列哪些是块级元素（）

A、input

B、ul

C、hr

D、li

E、div

F、form

参考答案：B,C,D,E,F

答案解析：

（1）行内元素有：a b span img input select strong

（2）块级元素有：div ul ol li dl dt dd h1 h2 h3 h4…p

（3）常见的空元素：

鲜为人知的是：

7.以下选项正确的是

A、<p />

B、<br />

C、<hr />

D、<img />

8关于Web 语义化的说法，正确的有？

A、语义化的含义就是用正确的标签做正确的事情

B、语义化让页面的内容结构化，结构更清晰

C、语义化便于对浏览器、便于代码阅读、便于维护

D、语义化便于SEO, 页面中多放置一些H1标签，会提高网页的排名

9.以下标签中，默认是块级元素的标签有：

A、span

B、div

C、p

D、img

需要更多学习资料的小伙伴可以一起进来探讨学习哦：907694362

最后编辑于：2019.11.19 15:55:59

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 204,732评论 6赞 478
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 87,496评论 2赞 381
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 151,264评论 0赞 338
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 54,807评论 1赞 277
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 63,806评论 5赞 368
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 48,675评论 1赞 281
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 38,029评论 3赞 399
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 36,683评论 0赞 258
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 41,704评论 1赞 299
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 35,666评论 2赞 321
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 37,773评论 1赞 332
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 33,413评论 4赞 321
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 39,016评论 3赞 307
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 29,978评论 0赞 19
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 31,204评论 1赞 260
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 45,083评论 2赞 350
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 42,503评论 2赞 343

2019阿里前端工程师面试题和答案解

推荐阅读更多精彩内容