当前位置: IT培训 > HTML5培训 > 前端开发 > HTML5面试题 > 阿里巴巴web前端面试题 看你能答对多少?
阿里巴巴web前端面试题 看你能答对多少? 时间:2017-12-14     来源:阿里巴巴web前端面试题分享

作为一名web前端工程师,能够找一份高薪且体面的工作是我们梦寐以求的事情。就像阿里、百度等这样的大公司是多少人削尖了脑袋想往里进的,但是无奈很多人要么因为经验不够要么因为准备不足都与这些企业擦肩而过。我们不管做什么,在做之前一定要做好充足的准备,同样面试也是这样一种情况,所以今天小编为您准备了一份阿里web前端的面试题,看你能做对多少呢?

阿里巴巴web前端面试题

一.单项选择题

1.下列事件哪个不是由鼠标触发的事件()

A.click

B.contextmenu

C.mouseout

D.keydown

正确答案: D

本题知识点:Javascript

参考解析:

click是鼠标点击事件

contextmenu 是当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件 [ 试试在页面中的 中加入 onContentMenu="return false" 就可禁止使用鼠标右键了 ]

mouseout 事件会在鼠标指针移出指定的对象时发生。

keydown 事件会在用户按下一个键盘按键时发生,由键盘触发

2.下面关于CSS布局的描述,不正确的是?

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

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

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

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

正确答案: D

本题知识点:Javascript

参考解析见下图:

3.下面有关html的描述,不推荐的是?

A.在页面顶部添加 doctype声明;

B.在< /head >… <body >中间插入 HTML 代码;

C.避免使用< font >标签;

D.使用 t<able>元素展现学生成绩表等数据。

正确答案: B

本题知识点:HTML/CSS Javascript

4.浏览器在一次 HTTP 请求中,需要传输一个 4097 字节的文本数据给服务端,可以采用那些方式?

A.存入 IndexdDB

B.写入 COOKIE

C.放在 URL 参数

D.写入 Session

E.使用 POST

F.放在 Local Storage

正确答案: E

本题知识点:HTML/CSS

参考解析:

IndexdDB 是 HTML5 的本地存储,把一些数据存储到浏览器(客户端)中,当与网络断开时,可以从浏览器中读取数据,用来做一些离线应用。

Cookie 通过在客户端 ( 浏览器 ) 记录信息确定用户身份,大为 4 kb 。

url 参数用的是 get 方法,从服务器上获取数据,大小不能大于 2 kb 。

Session 是服务器端使用的一种记录客户端状态的机制 。

post 是向服务器传送数据,数据量较大。

local Storage 也是 HTML5 的本地存储,将数据保存在客户端中(一般是永久的)。

5.下面哪个属性不会让 div 脱离文档流(normal flow)?

A.position: absolute;

B.position: fixed;

C.position: relative;

D.float: left;

正确答案: C

本题知识点:HTML/CSS

参考解析:

在css的定位机制有三种,分别是1:文档流,2:浮动(float),3定位(position)

其中文档流的意义就是按照HTML里面的写法就是从上到下,从左到右的排版布局;

在4答案选项中的属性,float(浮动)和position(定位)了

A:position: absolute;

生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位;都绝对定位了,肯定脱离了文档流。。

B:position: fixed;

生成绝对定位的元素,相对于浏览器窗口进行定位;相对于浏览器了,也和正常顺序排下来没什么关系。。

C:position: relative;

生成相对定位的元素,相对于其正常位置进行定位。生成相对定位,也就是说还在原本的上下左右之间,上下左右的元素都不变,so这个没有能脱离文档流。。就这个了

D:float: left;都浮动出去了,还上哪保持原位置去。。

终答案选择C。。

6.javascript 语言特性中,有很多方面和我们接触的其他编程语言不太一样,比如说,javascript语言实现继承机制的核心就是(prototype) ,而不是Java语言那样的类式继承。Javascript 解析引擎在读取一个Object的属性的值时,会沿着 (原型链)向上寻找,如果终没有找到,则该属性值为 (undefined); 如果终找到该属性的值,则返回结果。与这个过程不同的是,当javascript解析引擎执行“给一个Object的某个属性赋值”的时候,如果当前Object存在该属性,则改写该属性的值,如果当前的Object本身并不存在该属性,则赋值该属性的值 。

7.填写内容让下面代码支持a.name = “name1”; b.name = “name2”;(在1和2处填写)

function obj(name){

}
        1

obj. 2= "name2";

var a = obj("name1");
 

var b = new obj;

参考答案

(1) if(name){ this.name = name;}return this;

(2) prototype.name

8.输出对象中值大于2的key的数组

var data = {a: 1, b: 2, c: 3, d: 4};

Object.keys(data).filter(function(x) { return 1 ;})

期待输出:[“c”,”d”]

参考答案:(1) data[x]>2