首页 > > 网页制作 > css >

2019年阿里最新前端工程师面试题及答案题

2019-11-20 16:01:03来源：博客园阅读 ()

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

 <span class="caret"></span>

 </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>

<pre class="prettyprint"><div class="dropdown">

 <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" id="dropdownMenu1" type="button">

 Dropdown

 <span class="caret"></span>

 </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

如果你现在正在纠结是否继续学前端，如果你害怕半途而废不知道从何开始，如果你觉得这篇文章对你还是有很大帮助的话，不介意的话可以加下我刚刚建立的一个学习交流群，有很多相关资料和学习视频：907694362

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>

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

 <table border="10">

    <tr>

        <td align="center" colspan="2">公司</td>

    </tr>

    <tr>

        <td align="center" rowspan="2">名字</td>

        <td align="center">百度</td>

    </tr>

    <tr>

        <td align="center" colspan="2">百度</td>

    </tr>

    <table></table>

</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)

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

A、background-attachment:fixed;

B、background-attachment:scroll;

C、background-origin: initial;

D、background-clip: initial;

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

A、 $("#btnGo")

B、 $(".btnGo")

C、 $(".btn")

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

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

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”;

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

A、bind

B、mousedown

C、click

D、change

E、on

二、多选题（共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