前端笔试面试题目总结

时间:2024.4.20

希望对一起奋战找工作的战友们有帮助

列举3个以上http请求头,响应头有哪些字段,列举5个以上;http的响应状态消息有哪些值,列举4个以上说明

解析ajax的意思,同步和异步的区别,异步请求有哪些状态,如何创建一个异步请求,异步请求完成过程,说下IE与其他浏览器的差异

如何实现跨域请求,AJAX跨域的解决办法

html有哪些常用标签,大概多少个,如何分类的,html5有哪些新增标签 前端优化提高客户端响应速度的方法,至少10条以上

平常用哪些开发工具,用什么插件,了解哪些类库,是否熟悉php,nodejs,看过哪些书

网页设计中可以使用哪些图像格式,说下它们的优缺点

一个元素结点有哪些公共属性,哪些事件属性,各举5个以上

盒模型——外边距、内边距和边框之间的关系,IE 8以下版本的浏览器中的盒模型有什么不同。

布局的方式有哪些

使用缓存的方式有哪些,说下各种方式的优缺点与发展过程

怎么实现一个元素的居中

display,position的属性值有哪些

元素的属性简写,如font,background,

html5有哪些新功能,都有哪些新的JS API,列举5条以上

介绍几个css3的属性,选择器有哪些

css的基本语句构成是,有哪些选择器,css3新增的有哪些

CSS引入样式的方式有哪些,link和@import的区别是,如何计算样式的优先级 你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

经常遇到的浏览器的兼容性有哪些?怎么会出现?解决方法是什么?

常用到哪些类库,是否了解jq的实现,说一下对jq代码的理解,基本的架构或者 jQuery.fn.init 中都做了哪些判断,是否了解sizzle,

前端页面由层级结构是怎样的,分别是什么?作用是什么?是否了解MVC模型,在前端如何实现MVC

简单介绍一下js的语法特点,数据类型

说一下字符串,数组的常用方法

js的继承方式

js的运算符与优先级

创建对象的方法

JSON与JSONP的区别

DOM结点的选择有哪些方法,有哪些元素集合可直接选取,如果选择一个节点有父节点,子节点,兄弟节点(nextSibling与nextElementSibling,IE与其他浏览器的差别)

简单介绍DOM节点层级

节点怎样添加、移除、移动、复制、创建和查找节点

IE与FF的JS兼容性都知道哪些

IE事件流与其他浏览器事件流特点,绑定事件的差异

正则表达式是否熟悉,有哪些元字符,何为分组,捕获,零宽断言,零宽度正预测先

行断言,零宽度正回顾后发断言,如何实现贪婪匹配与懒惰匹配,简单写下邮箱验证、URL验证

严格模式与混杂模式——如何触发这两种模式,区分它们有何意义

是否理解这些英文简写:HTML,CSS,XML,XHTML,E4X,Xpath,HTTP, W3C, WHATWG, MIME,ECMA,BOM,DOM,URL,URI

说下下面这些单词的来源与使用:

Angular; Backbone; Console; Dir; Express; Fork; Grunt; Haslayout; Iconfont;

Jsonp; Kissy; Localstorage; Media

query; Npm; Opacity; Prototype; Querystring; Referer;

Seajs; Trim; Underscore;

Vim; Worker; Xss; Yslow; Zepto;(淘宝控制台)

HTML&CSS:

对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功:布局、盒子模型、选择器优先级及使用、HTML5、CSS3、移动端适应

JavaScript:

数据类型、面向对象、继承、闭包、插件、作用域、跨域、原型链、模块化、自定义事件、内存泄漏、事件机制、异步装载回调、模板引擎、Nodejs、JSON、ajax等。

其他:

HTTP、安全、正则、优化、重构、响应式、移动端、团队协作、可维护、SEO、UED、架构、职业生涯

作为一名前端工程师,无论工作年头长短都应该必须掌握的知识点:

此条由 王子墨 发表在 前端随笔

1、DOM结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。

2、DOM操作 ——如何添加、移除、移动、复制、创建和查找节点等。

3、事件 —— 如何使用事件,以及IE和标准DOM事件模型之间存在的差别。

4、XMLHttpRequest —— 这是什么、怎样完整地执行一次GET请求、怎样检测错误。

5、严格模式与混杂模式 —— 如何触发这两种模式,区分它们有何意义。

6、盒模型 —— 外边距、内边距和边框之间的关系,及IE8以下版本的浏览器中的盒模型

7、块级元素与行内元素 —— 怎么用CSS控制它们、以及如何合理的使用它们

8、浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。

9、HTML与XHTML——二者有什么区别,你觉得应该使用哪一个并说出理由。

10、JSON —— 作用、用途、设计结构。

HTML

Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

行内元素有哪些?块级元素有哪些? 空(void)元素有那些?

介绍一下CSS的盒子模型?

link 和@import 的区别是?

CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3新增伪类有那些?

如何居中div?如何居中一个浮动元素?

浏览器的内核分别是什么?

html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和

HTML5?

语义化的理解?

HTML5的离线储存?

(写)描述一段语义的html代码吧。

iframe有那些缺点?

请描述一下 cookies,sessionStorage 和 localStorage 的区别?

CSS

列出display的值,说明他们的作用。position的值, relative和absolute定位原点是?

CSS3有哪些新特性?

一个满屏 品 字布局 如何设计?

经常遇到的浏览器的兼容性有哪些?原因,解决方法是什么,常用hack的技巧 ?

为什么要初始化CSS样式。

absolute的containing block计算方式跟正常流有什么不同?

position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样?

对BFC规范的理解?

css定义的权重

解释下浮动和它的工作原理?清除浮动的技巧

用过媒体查询,针对移动端的布局吗?

使用 CSS 预处理器吗?喜欢那个?

JavaScript

JavaScript原型,原型链 ? 有什么特点?

eval是做什么的?

null,undefined 的区别?

写一个通用的事件侦听器函数。

Node.js的适用场景?

介绍js的基本数据类型。

Javascript如何实现继承?

["1", "2", "3"].map(parseInt) 答案是多少?

如何创建一个对象? (画出此对象的内存图)

谈谈This对象的理解。

事件、IE与火狐的事件机制有什么区别? 如何阻止冒泡?

什么是闭包(closure),为什么要用它?

"use strict";是什么意思 ? 使用它的好处和坏处分别是什么?

如何判断一个对象是否属于某个类?

new操作符具体干了什么呢?

Javascript中,有一个函数,执行时对象查找时,永远不会去查找原型,这个函数是?

JSON 的了解?

js延迟加载的方式有哪些?

ajax 是什么?

同步和异步的区别?

如何解决跨域问题?

模块化怎么做?

AMD(Modules/Asynchronous-Definition)、CMD(Common Module Definition)规范区别?

异步加载的方式有哪些?

.call() 和 .apply() 的区别?

Jquery与jQuery UI 有啥区别?

JQuery的源码看过吗?能不能简单说一下它的实现原理?

jquery 中如何将数组转化为json字符串,然后再转化回来?

针对 jQuery 的优化方法?

JavaScript中的作用域与变量声明提升?

如何编写高性能的Javascript?

那些操作会造成内存泄漏?

JQuery一个对象可以同时绑定多个事件,这是如何实现的?

其他

你遇到过比较难的技术问题是?你是如何解决的?

常使用的库有哪些?常用的前端开发工具?开发过什么应用或组件?

页面重构怎么操作?

列举IE 与其他浏览器不一样的特性?

99%的网站都需要被重构是那本书上写的?

什么叫优雅降级和渐进增强?

WEB应用从服务器主动推送Data到客户端有那些方式?

对Node的优点和缺点提出了自己的看法?

你有哪些性能优化的方法?

http状态码有那些?分别代表是什么意思?

一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?(流程说的越详细越好)

除了前端以外还了解什么其它技术么?你最最厉害的技能是什么?

你常用的开发工具是什么,为什么?

对前端界面工程师这个职位是怎么样理解的?它的前景会怎么样?

加班的看法?

平时如何管理你的项目?

如何设计突发大规模并发架构?

说说最近最流行的一些东西吧?常去哪些网站?

移动端(Android IOS)怎么做好用户体验?

你在现在的团队处于什么样的角色,起到了什么明显的作用?

你认为怎样才是全端工程师(Full Stack developer)?

介绍一个你最得意的作品吧?

最近在学什么?能谈谈你未来3,5年给自己的规划吗?

答案

仅供参考。如有疑问,欢迎反馈。

如果想进一步了解相关知识,可以 google 答案中的关键词,或者到 SegmentFault 问答平台 交流。

HTML

Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

<!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前。告知浏览器的解析器, 用什么文档类型 规范来解析这个文档。

严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行。

在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。

DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。 DOM操作——怎样添加、移除、移动、复制、创建和查找节点。

事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。

XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。 严格模式与混杂模式——如何触发这两种模式,区分它们有何意义。

盒模型——外边距、内边距和边框之间的关系,IE 8以下版本的浏览器中的盒模型有什么不同。

块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。

浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。 HTML与XHTML——二者有什么区别,你觉得应该使用哪一个并说出理由。

JSON——它是什么、为什么应该使用它、到底该怎么使用它,说出实现细节来。

行内元素有哪些?块级元素有哪些? 空(void)元素有那些?

1. 对于Web2.0的理解;

2. 常用的WEB开发和测试工具(JS,CSS,HTML,程序脚本……);

3. 对于网站优化的理解(SEO,UEO);

4. 通过哪些网站或者博客了解和交流互联网最新技术;

5. 最欣赏哪些网站;

6. 对开发框架的理解;

7. 请用css实现下列要求的效果:

1.一个列表包含标题和时间

2.列表宽度固定,高度自由设置

3.时间紧跟标题,但标题过长时需要隐藏。

HTML相关

1. <!DOCTYPE>标签的定义与用法。

2. 块级元素和行内元素都有哪些?

3. 你真的了解HTML吗? 雅虎面试题 把前面黄底那段拿去搜索下就知道了(曾在某浪公司面试的时候被问到过,确实是很好的问题)。

CSS相关

1. 介绍所知道的CSS hack技巧(如:_, *, +, \9, !important 之类)。

2. 介绍CSS盒模型。

3. CSS层叠是什么?介绍一下。

4. 都知道哪些CSS浏览器兼容性问题。

5. 有时会被问到些刁钻点的题,比如position值都有哪些,CSS3都有哪些新内容...

JavaScript基础相关

1. HTTP协议的状态消息都有哪些?(如200、302对应的描述)

2. AJAX是什么? AJAX的交互模型(流程)? AJAX跨域的解决办法?

3. 同步和异步的区别?

4. 简述JavaScript封装。

5. JavaScript继承有哪两种形式形式,进行描述。

7. 在JS中this关键字的使用场合和用法(如在构造函数中、setTimeout中等)。

8. 简述下cookie的操作,还有cookie的属性都知道哪些。

9. IE与FF的JS兼容性都知道哪些。

10. DOM操作 - 怎样添加、移除、移动、复制、创建和查找节点(这个问题真心是基础题,一般不会问)。

jQuery相关

1. jQuery源码是否尝试去读过?说说基本的架构或者 jQuery.fn.init 中都做了哪些判断。

2. 都知道哪些不好的jQuery书写方式。

3. Sizzle是否有读过?

其它相关的加分项:

1. 都使用和了解过哪些编辑器?都使用和了解过哪些日常工具?

2. 都知道有哪些浏览器内核?开发过的项目都兼容哪些浏览器?

3. 国内外的JS牛人都知道哪些?

4. 瀑布流布局或者流式布局是否有了解

4. 正则表达式有系统学习过吗(看书或网上教程)?有的话就问问简单点的邮箱验证、URL验证, 或者问问 贪婪匹配与懒惰匹配 的理论知识。

5. Node.js是否有过尝试?到什么程度?说说个人理解的看法?

6. HTML5都有哪些新的JS API?

7. 前端优化知识都知道哪些?

8. 基础算法题(如快速排序,能否一两句说说重要的核心原理或者数组消重等)。

9. 是否有接触过或者了解过重构。

你用Twitter吗? (在天朝最好问你用微博吗?)

? 如果用,你都关注那些人?

你用Github吗?

? 如果用,你关注的项目有什么?

你关注的博客有那些?

你使用那些版本管理系统,比如Git,SVN等?

你常用的开发环境是怎样的?比如操作系统,文本编辑器,浏览器,及其他工具等。

你能描述一下你制作一个网页的工作流程吗?

你能描述一下渐进增强和优雅降级之间的不同吗?

? 如果提到了特性检测,可以加分。

请解释一下什么是语义化的HTML。

你更喜欢在哪个浏览器下进行开发?你使用那些开发人员工具?

你如何对网站的文件和资源进行优化?

? 期待的解决方案包括:

1. 文件合并

2. 文件最小化/文件压缩

3. 使用CDN托管

4. 缓存的使用

5. 其他

为什么利用多个域名来存储网站资源会更有效?

? 浏览器一次可以从一个域名下做多少资源?

请说出三种减低页面加载时间的方法。(加载时间指感知的时间或者实际加载时间)

如果你接到了一个使用Tab来缩进代码的项目,但是你喜欢空格,你会怎么做? ? 建议这个项目使用像EditorConfig(http://editorconfig.org)之类的规范

? 为了保持一致性,转换成项目原有的风格

? 直接使用VIM的retab命令

请写一个简单的幻灯效果页面

? 如果不使用JS来完成,可以加分。

你都使用那些工作来测试代码的性能?

? 例如JSPerf (http://jsperf.com/)

? 例如Dromaeo (http://dromaeo.com/)

? 其它。

如果今年你打算熟练掌握一项新技术,那会是什么?

请谈一下你对网页标准和标准制定机构重要性的理解。

什么是FOUC?你如何来避免FOUC?

HTML相关问题

________________________________________

文档类型的作用是什么?你知道多少种文档类型?

浏览器标准模式和怪异模式之间的区别是什么?

使用XHTML的局限有那些?

? 如果页面使用'application/xhtml+xml'会有什么问题吗? 如果网页内容需要支持多语言,你会怎么做?

? 在设计和开发多语言网站时,有哪些问题你必须要考虑? 在HTML5的页面中可以使用XHTML的语法吗?

在HTML5中如何使用XML?

'data-'属性的作用是什么?

如果把HTML5看作做一个开放平台,那它的构建模块有那些?

请描述一下cookies,sessionStorage和localStorage的区别? JS相关问题

________________________________________

你使用过那些Javascript库?

你是否研究过你所使用的JS库或者框架的源代码?

什么是哈希表?

'undefined'变量和'undeclared'变量分别指什么?

闭包是什么,如何使用它,为什么要使用它?

? 你喜欢的使用闭包的模式是什么?

请举出一个匿名函数的典型用例?

请解释什么是Javascript的模块模式,并举出实用实例。

? 如果有提到无污染的命名空间,可以考虑加分。

? 如果你的模块没有自己的命名空间会怎么样?

你如何组织自己的代码?是使用模块模式,还是使用经典继承的方法? 请指出Javascript宿主对象和内置对象的区别?

描述css reset的作用和用途。

描述下浮动和它的工作原理。

清除浮动的方法有那些,分别适用于什么情形。

解释css sprites,如何使用。

你最喜欢的图片替换方法是什么,你如何选择使用。

讨论CSS hacks,条件引用或者其他。

如何为有功能限制的浏览器提供网页。

? 你会使用那些技术和处理方法。

如何视觉隐藏网页内容,只让它们在屏幕阅读器中可用。

你使用过网格系统吗?如果使用过,你最喜欢哪种?

你使用过meidia queries(媒体查询)吗,或者移动网站相关的CSS布局。 你熟悉SVG样式的书写吗?

如何优化网页的打印样式。

在书写高效CSS文件时会有哪些问题需要考虑。

你使用CSS预处理器吗?(SASS,Compass,Stylus,LESS)

? 如果使用,描述你的喜好。

你是否接触过使用非标准字体的设计?

? 字体服务,Google Webfonts, Typekit,等等。

请解释浏览器是如何根据CSS选择器选择对应元素的。

可选的有趣问题

________________________________________

你编写过的最酷的代码是什么?其中你最自豪的是什么?

你知道HTML5的帮派标志吗?

你是否正在或曾经在一艘船上。(不懂这个幽默)

你使用的开发工具中,你最喜欢的部分是什么?

你有什么业余项目吗?是那种类型的?

解释cornify的重要性?(本题完全摸不到头脑)

在一张纸上,垂直写下ABCDE,然后不用任何代码,将他们到序排列。 ? 静静的看他们是否将纸反转。

海盗还是忍者?

? 如果是两者的合体,并有恰当理由,可以加分。如果是僵尸猴子海盗加忍者加两分。(注:此题文化差异过大)

如果没有在Web开发,你会做什么?

卡门圣迭哥的隐藏处在哪里?

? 提示:本题的答案永远是错的。

你最爱的IE特性是什么?

完句填空: Brendan Eich和Doug Crockford是JavaScript的________。 讨论:jQuery是牛逼的库还是最牛逼的库。

更多相关推荐:
WEB前端面笔试题总结

1如何显示隐藏一个DOM元素更改元素的cssstyle设为displaynone此外还可以将visibility设为hidden透明度设为0或长宽设为02一个定宽网页在浏览器IE6IE7FirefoxIE5中横...

web前端笔试题面试题汇总+前端优化总结

前端是庞大的包括HTMLCSSJavascriptImageFlash等等各种各样的资源前端优化是复杂的针对方方面面的资源都有不同的方式那么前端优化的目的是什么1从用户角度而言优化能够让页面加载得更快对用户的操...

前端面试笔试题总结

JavaScript类库jQueryPrototypeJavaScript框架BackBoneVuejsAngularjsReactjsCSS预编译器LessCssSassJavaScript模块加载器Requ...

前端面试题总结

1.!DOCTYPE标签的定义与用法。DOCTYPE声明是指HTML文档开头处的一行或两行代码,它描述使用哪个DTD(documenttypedefinition)。DOCTYPE通常——但不总是——包含指定的…

前端工程师面试试题

20xx年最新前端开发面试题Thelasttimethatrefresh20xx113123757本文主要是由于我最近在找前端开发职位所以总结了一些常见前端面试多数来源于网络希望看的朋友阅后也要用心钻研其中的原...

20xx年最新前端开发面试题(题目列表+答案 完整版)

前言本文总结了一些优质的前端面试题多数源于网络初学者阅后也要用心钻研其中的原理重要知识需要系统学习透彻学习形成自己的知识链万不可投机取巧只求面试过关是错误的面试注意点1面试题目根据你的等级和职位变化入门级到专家...

部分web前端面试题

1判断字符串是否是这样组成的第一个必须是字母后面可以是字母数字下划线总长度为520varregazAZazAZ09419regtestquota1aa1aa1aa1aquot2截取字符串abcdefg的efgv...

web前端面试题

拦截器与过滤器的区别以及他们的执行顺序过滤器是在javaweb中你传入的requestresponse提前过滤掉一些信息或者提前设置一些参数然后再传入servlet或者struts的action进行业务逻辑比如...

web前端面试题

智能社高级JSHTML5培训淘宝店常见前端开发面试题摘要面试题是招聘公司和开发者都非常关心的话题公司希望通过它了解开发者的真实水平和细节处理能力开发者希望能够最大程度地展示自己的水平甚至超常发挥本文提供了众多前...

web前端面试题

1W3C标准有哪些W3C推行的主要规范有HTMLCSSXMLXHTML和DOMDocumentObjectModel2谈谈Js的内存泄露问题3谈谈对Html5的了解4谈谈对CSS3的了解5用js实现随即选取10...

java面试题总结

第一谈谈finalfinallyfinalize的区别final用于声明属性方法和类分别表示属性不可变方法不可覆盖类不可继承finally是异常处理语句结构的一部分表示总是执行finalize是Object类的...

[面试题] 好玩的面试题,在学校老师总结的!人事面试题!

1请你自我介绍一下回答提示一般人回答这个问题过于平常只说姓名年龄爱好工作经验这些在简历上都有其实企业最希望知道的是求职者能否胜任工作包括最强的技能最深入研究的知识领域个性中最积极的部分做过的最成功的事主要的成就...

前端面试题总结(26篇)