2020 京东前端面试题及参考答案

337 阅读12分钟

需要更多的面试题点击下面链接查看,有很多:

web前端全栈资料粉丝福利(面试题、视频、资料笔记、进阶路线)


1.以下()函数不是jQuery 内置的与AJAX 相关的函数。

A、$.ajax()

B、$.get()

C、$.post()

D、$.each()

参考答案:D

答案解析:暂无

2.下面关于HTML 的描述正确的一项是?

A、HTML5 中的所有标签都必须写结束标签

B、DOCTYPE 的设置不会影响页面的展示效果

C、HTML5 中的属性名对大小写敏感

D、HTML5 中可以使用data-* 自定义属性

参考答案:D

答案解析:略

3.下列哪一个是页面载入时会触发什么Dom 事件?

A、onchangeB、onaclive

C、onload

D、onresize

参考答案:C

答案解析:onload 是加载完触发,学习自己要理解到位,但做题,适当理解题目的不严谨。

4.关于bootstrap3 的说法,错误的是

A、在windows 上支持IE8

B、在IOS 上支持Opera

C、在MAC OS 及Windows 上支持firefox

D、在IOS 及android 上都支持chrome

参考答案:B

答案解析:无

5.标签中,哪个是表格边框线的粗细?

A、bordercolor

B、borderC、cellspacing

D、cellpadding

参考答案:B

答案解析:

bordercolor 表示边框颜色;

cellspacing 表示单元格之间的间隔;

cellpadding 表示单元格内边距。

6.若要在网页中插入样式表main.css,以下用法中正确的是()

A、<link rel="stylesheet" src="main.css" type="text/css">

B、<link rel="stylesheet" href="main.css" type="text/css">

C、<style rel="stylesheet" href="main.css" type="text/css">

D、<include rel="stylesheet" href="main.css" type="text/css">

参考答案:B

答案解析:略

7.获取input 节点的正确方法是( )

<form class="file" name="upload">

<input id="file" name="file"></input></form>

HTML

A、document.querySelectorAll('file')[0]

B、document.getElementById('file')[0]

C、document.getElementByTagName('file')[0]

D、document.getElementsByClassName('file')[0]

参考答案:D

答案解析:全错了,fuc\*

8.下列哪些不属于HTML input 元素种类:

A、searchB、datetime

C、range

D、bool

参考答案:D

9.下面关于React 说法错误的是

A、React DOM 在渲染之前会默认过滤所有传入的值

B、React DOM 在渲染过程中只会更新改变了的部分

C、直接通过赋值更新React 组件状态不会重新渲染组件,

必须使用setState 方法

D、JSX 是JavaScript 的一种语法扩展,React 的使用依

赖JSX

参考答案:D

答案解析:纯React 创建节点的话可以用React.createElement,组件的话有ES6 class、createClass 或stateless function 三种创建方法(目前)

10.要去掉文本超链接的下划线,下列正确的是()

A、a{underline:none}

B、a{ text-decoration:none}

C、a{ text-decoration:underline}D、a{ decoration:no underline}

参考答案:B

11.获取当前时间的JavaScript 语句是()

A、new Now()

B、new Date()

C、GetTime()

D、now()

参考答案:B

答案解析:略。

12.阅读如下代码,请问wrap 这个div 的高度是多少?

<style type="text/css">

.a, .b, .c {

box-sizing: border-box;

border: 1px solid;

}.wrap {

width: 250px;

}

.a {

width: 100px;

height: 100px;

float: left;

}

.b {

width: 100px;

height: 50px;float: left;

}

.c {

width: 100px;

height: 100px;

display: inline-block;

}</style><span style="color: rgb(51,51,51);">

</span><span style="color: rgb(51,51,51);"> </

span><div class="wrap">

<div class="a">a</div>

<div class="b">b</div>

<div class="c">c</div></div>HTML

A、100px

B、150px

C、200px

D、250px

参考答案:B

答案解析:

因为他都是向左浮动他的宽度是200,所以wrap 的高度应该是,B+C=150px

13.HTML 语句中,用来表示标题的标签是()

A、<h1>

B、<header>

C、<hr>

D、<heading>

参考答案:A

14.关于form 标签的说法,下列错误的是?()

A、<form> 标签用于为用户输入创建HTML 表单B、数据通过设置的action 属性提交到指定的位置

C、<form>标签目前只支持GET 和POST 请求,且默认为

GET

D、<form>标签的enctype 属性值默认为multipart/form-data

参考答案:D

答案解析:enctype 属性的值由四个application/x-www-form-urlencoded:在发送前编码所有字符(默认)multipart/form-data:不对字符编码。

在使用包含文件上传控件的表单时,必须使用该值。text/plain:空格转换为"+" 加号,但不对特殊字符编码。application/json:json 格式的数

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

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 协议簇,它帮助每台计算机在发送或中转信件时找到下一个目的地。

16.当在进行前端界面和后台服务进行交互时,常常需要从后台服务中获取一组数据,现...当在进行前端界面和后台服务进行交互时,常常需要从后台服务中获取一组数据,现在需要将一组数据放入到数组中,正确的是()

A、var arr=new array(); for(vari=0;i<data.length;i++){ arr.add(data[i]); }

B、var arr=new array(); for(vari=0;i<data.length;i++){ arr.push(data[i]); }

C、var arr=new array(); for(vari=0;i<data.length;i++){ arr.shift(data[i]); }

D、var arr=new array(); for(vari=0;i<data.length;i++){ arr.pop(data[i]); }

参考答案:B

17.关于嵌套列的用法,正确的是

A、<div class=“row”><br> <div class=“col-sm-1”>

B、<div class=“col-sm-1”><br><divclass=“row”><br>

C、<div class=“row”><br> <divclass=“container”><br> <divclass=“col-xs-1”><br>D、<div class=“container”><br> <divclass=“row”><br> <div class=“col-xs-1”>

参考答案:D

答案解析:

Bootstrap 框架的网格系统工作原理如下:1 、数据行(.row) 必须包含在容器(.container )中,以便为其赋予合适的对齐方式和内距(padding) 。

如:

container ">

row ">

2 、在行(.row) 中可以添加列(.column) ,但列数之和不能超过平分的总列数,比如12 。

如:

4 ">

8 ">

3 、具体内容应当放置在列容器(column )之内,而且只有列(column )才可以作为行容器(.row) 的直接子元素4 、通过设置内距(padding )从而创建列与列之间的间距。然后通过为第一列和最后一列设置负值的外距(margin )来抵消内距(padding) 的影响

详:

D(正确)

关于列的嵌套Bootstrap 框架的网格系统还支持列的嵌套。你可以在一个列中添加一个或者多个行(row )容器,然后在这个行容

器中插入列。但在列容器中的行容器(row ),宽度为100% 时,就是当前外部列的宽度。

详:

18.下面javascript 的结果是:v

ar name = 'out'var person = {

name: 'in', getName: function () {

setTimeout(function () {

console.log('a=' + this.name)}, 0)

}}var getName = person.getName();getName();

JavaScript

A、a=in

B、a=out

C、in

D、out

参考答案:B

答案解析:这里this 指向了最外层windows。所以这里值a=out

19.请选择产生粗体字的HTML 标签:

A、<bold>

B、<bb>

C、<b>

D、<bld>

参考答案:C答案解析:html 语言中加粗的标签有和,或者使用css 设置{font-weight:bold}****

20.CSRF 攻击描述错误的是?

A、CSRF 需要有JavaScript 代码

B、CSRF 攻击恶意代码位于第三方站点上

C、过滤用户的输入可以防止恶意代码注入到某个站点,但

是它无阻止法恶意代码在第三方站点上运行

D、CSRF 符合同源策略

参考答案:A

答案解析:

XSS 攻击需要JavaScript 代码,CSRF 攻击不需要JavaScript 代码

21.冒泡排序算法在非有序的序列中时间复杂度是?()

A、O(nlogn)

B、O(n^2)

C、O(n)

D、O(n^2logn)

参考答案:B答案解析:\### 时间复杂度平均[时间复杂度](https://baike.baidu.com/item/%E6%97%B6%E9%97%B4%E5%A4%8D%E6%9D%82%E5%BA%A6)

[插入排序](https://baike.baidu.com/item/%E6%8F%92%E5%85%A5%E6%8E%92%E5%BA%8F) O(n^2)

[冒泡排序](https://baike.baidu.com/item/%E5%86%92%E6%B3%A1%E6%8E%92%E5%BA%8F) O(n^2)

[选择排序](https://baike.baidu.com/item/%E9%80%89%E6%8B%A9%E6%8E%92%E5%BA%8F) O(n^2)

[快速排序](https://baike.baidu.com/item/%E5%BF%AB%E9%80%9F%E6%8E%92%E5%BA%8F) O(n log n)

[堆排序](https://baike.baidu.com/item/%E5%A0%86%E6%8E%92%E5%BA%8F) O(n log n)

[归并排序](https://baike.baidu.com/item/%E5%BD%92%E5%B9%B6%E6%8E%92%E5%BA%8F) O(n log n)

[基数排序](https://baike.baidu.com/item/%E5%9F%BA%E6%95%B0%E6%8E%92%E5%BA%8F) O(n)

[希尔排序](https://baike.baidu.com/item/%E5%B8%8C%E5%B0%94%E6%8E%92%E5%BA%8F)O(n^1.25)

22.下列关于CSS 样式几种定义方式的说法中错误的是()。

A、单一选择符方式即定义中只含有一个选择符,这些选择符通常是要定义样式的HTML 标签,例如:body{background-color:#ffffff}就属于单一选择符方式。

B、使用类选择符方式可以将同一元素分类定义为不同的样式。类选择符要以“.”号开头,选择符的名称可以由设计者定义。

C、CSS 允许把相同属性和值的选择符组合起来,这些选择符之间需用逗号隔开。例如,h1,h2,h3,h4,h5,h6{font-family:楷体}属于选择符组合方式。

D、td a:link{text-decoration:underline}该定义用于将网页中所有表格中的单元格中的超链接文本设置下划线,而对于单元格中的非超链接文本则不起作用,对页面中表格以外的超链接文本同样也起作用。

23.下列叙述中正确的是?

A、算法的效率只与问题的规模有关,而与数据的存储结构无关

B、算法的时间复杂度是指执行算法所需要的计算工作量

C、数据的逻辑结构与存储结构是一一对应的

D、算法的时间复杂度与空间复杂度一定相关

24.css3 中要使元素由一种样式转换成另一种样式,为元素添加效果的属性是?

A、animationB、keyframes

C、flash

D、transform

25.HTTPS 是一种安全的HTTP 协议,它使用()来发送和接收报文。

A、TCP 的443 端口

B、UDP 的443 端口

C、TCP 的80 端口

D、UDP 的80 端口

二、多选题(共5 题,每题5 分)

1.关于栅格系统,哪些是正确的

A、col-sm-*

B、col-xs-*

C、col-md-*

D、col-lg-*.

2.HTTP request 报文结构说法正确的有?

A、首行是Request-Line 包括:请求方法,请求URI,协议版本,CRLF

B、首行之后是若干行请求头,包括general-header,request-header 或者entity-header,每个一行以CRLF结束

C、请求头和消息实体之间有一个CRLF 分隔

D、根据实际请求需要可能包含一个消息实体

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

答案解析:

rfc2616 中进行了定义:首行是Request-Line 包括:请求方法,请求URI,协议版本,CRLF

首行之后是若干行请求头,包括general-header,request-header 或者entity-header,每个一行以CRLF结束

请求头和消息实体之间有一个CRLF 分隔

根据实际请求需要可能包含一个消息实体一个请求报文例

子如下:GET /Protocols/rfc2616/rfc2616-sec5.html

HTTP/1.1 Host: www.w3.org Connection: keep-aliveCache-Control: max-age=0 Accept:text/html,application/xhtml+xml,application/xml;q

=0.9,image/webp,/;q=0.8 User-Agent: Mozilla/5.0(Windows NT 6.1; WOW64) AppleWebKit/537.36(KHTML, like Gecko) Chrome/35.0.1916.153

Safari/537.36Referer: https://www.google.com.hk/ Accept-Encoding: gzip,deflate,sdch Accept-Language:zh-CN,zh;q=0.8,en;q=0.6 Cookie: authorstyle=yesIf-None-Match: "2cc8-3e3073913b100"If-Modified-Since: Wed, 01 Sep 2004 13:24:52 GMTname=qiu&age=25

3.下列选项中哪些属性是CSS3 新增的?

A、box-sizing

B、transition

C、border-collapse

D、border-radius

4.在使用table 表现数据时,有时候表现出来的会比自己实际设置的宽度要宽,为此需要设置下面哪些属性值?

A、cellpadding=”0″B、padding:0

C、margin:0

D、cellspacing=”0″

5.以下关于sessionStorage,localStorage,cookie的说法错误的有?

A、cookie 会在请求时发送到服务器,作为会话标识,服务器可修改cookie;web storage 不会发送到服务器

B、cookie 有path 概念,子路径可以访问父路径cookie,父路径不能访问子路径cookie

C、共享:sessionStorage 能共享,localStorage 在同源文档之间共享,cookie 在同源且符合path 规则的文档之间共享

D、浏览器不能保存超过300 个cookie,单个服务器不能超过20 个,每个cookie 不能超过4k。web storage 大小支持能达到5M

参考答案:C

答案解析:

sessionStorage,localStorage,cookie 区别都会在浏览器端保存,有大小限制,同源限制cookie 会在请求时发送到服务器,作为会话标识,服务器可修改cookie;web storage 不会发送到服务器cookie 有path 概念,子路径可以访问父路径cookie,父路径不能访问子路径cookie

有效期:

cookie 在设置的有效期内有效,默认为浏览器关闭;sessionStorage 在窗口关闭前有效,localStorage 长期有效,直到用户删除

共享:sessionStorage 不能共享,localStorage 在同源文档之间共享,cookie 在同源且符合path 规则的文档之间共享localStorage 的修改会促发其他文档窗口的update 事件cookie 有secure 属性要求HTTPS 传输浏览器不能保存超过300 个cookie,单个服务器不能超过20 个,每个cookie 不能超过4k。web storage 大小支持能达到5M