当前位置：文档之家 › Web前端常见题目及答案

Web前端常见题目及答案

  • 格式：docx
  • 大小：20.69 KB
  • 文档页数：5

HTML

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

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

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

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

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

2、行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？

 CSS规范规定，每个元素都有display属性，确定该元素的类型，每个元素都有默认的display值， 比如div默认display属性值为“block”，成为“块级”元素； span默认display属性值为“inline”，是“行内”元素。

 行内元素有：span, strong, em, br, img , input, label, select, textarea, cite

 块级元素有：div, p , form, ul, i , ol, dl, form, address, fieldset, hr, menu, table

 知名的空元素：

鲜为人知的是：

3、 介绍一下CSS的盒子模型？

4、 link 和@import 的区别是？

 link属于XHTML标签，而@import是CSS提供的;

 页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载;

 import只在IE5以上才能识别，而link是XHTML标签，无兼容问题;

 link方式的样式的权重 高于@import的权重.

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

6、 如何居中div？如何居中一个浮动元素？

居中div{ margin: 0 auto;}

居中浮动元素

7、 浏览器的内核分别是什么? IE浏览器的内核Trident、 Mozilla的Gecko、Safari的WebKit、Chrome的Blink（WebKit的分支）、Opera内核原为Presto，现为Blink。

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

HTML5？

9、语义化的理解？

10、HTML5的离线储存？

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

12、 iframe有那些缺点？

13、 请描述一下 cookies，sessionStorage 和 localStorage 的区别？

CSS

1、 列出display的值，说明他们的作用。position的值， relative和absolute定位原点是？

2、 CSS3有哪些新特性？

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

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

5、 为什么要初始化CSS样式。

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

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

8、 对BFC规范的理解？

9、 css定义的权重

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

11、用过媒体查询，针对移动端的布局吗？

12、使用 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年给自己的规划吗？

合集下载

前端类题目

前端类题目

1、简要描述常见的浏览器内核。

浏览器内核赋值对网页语法的解释并显示网页，它决定了浏览器如何显示网页的内容以及页面的格式信息。

常见的浏览器内核：

Trident：IE浏览器

Gecko：Mozilla浏览器，如Firefox

Webkit：Safari浏览器，也是Chrome浏览器的内核

Blink：Chrome浏览器，Opera浏览器

2. document load 和document ready的区别

Document.onload 是在结构和样式加载完才执行js

Document.ready原生种没有这个方法，jquery中有 $().ready(function)

3.请编码写出一个满足下列条件的表格。

a.表格3行，第一行一列，第二行两列，第三行三列

b.表格每行的宽度相同

4.请写出3种jquery选择器，并解释其用法

WEB前端开发人员须知的常见浏览器兼容问题及解决技巧

WEB前端开发人员须知的常见浏览器兼容问题及解决技巧

WEB前端开发人员须知的常见浏览器兼容问题及解决技巧

所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显

示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们

的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开

发人员经常会碰到和必须要解决的问题。

在学习浏览器兼容性之前，我想把前端开发人员划分为两类：

第一类是精确按照设计图开发的前端开发人员，可以说是精确到1px的，他们很容易就会

发现设计图的不足，并且在很少的情况下会碰到浏览器的兼容性问题，而这些问题往往都是

浏览器的bug，并且他们制作的页面后期易维护，代码重用问题少，可以说是比较牢固放

心的代码。

第二类是基本按照设计图来开发的前端开发人员，很多细枝末节差距很大，不如间距，行高，

图片位置等等经常会差几px。某种效果的实现也是反复调试得到，具体为什么出现这种效

果还模模糊糊，整体布局十分脆弱。稍有改动就乱七八糟。代码为什么这么写还不知所以然。

这类开发人员往往经常为兼容性问题所困。修改好了这个浏览器又乱了另一个浏览器。改来

改去也毫无头绪。其实他们碰到的兼容性问题大部分不应该归咎于浏览器，而是他们的技术

本身了。

这篇文章主要针对的是第一类，严谨型的开发人员，因此这里主要从浏览器解析差异的角度

来分析兼容性问题

浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同

问题症状：随便写几个标签，不加样式控制的情况下，各自的margin和padding差异较大。

碰到频率:100%

解决方案：css里*{margin:0;padding:0;}

备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的css文件开头都会用

通配符*来设置各个标签的内外补丁是0。

浏览器兼容问题二：块属性标签float后，又有横行的margin情况下，在ie6显示margin比设置的

Web前端常见的英文缩写

Web前端常见的英文缩写

Web前端常见的英⽂缩写

1. PV （Page View）页⾯浏览量

2. FED（Front-End Development）前端开发

3. F2E（Front-End Engineer）前端⼯程师

4. WWW（World Wide Web）万维⽹

5. W3C（World Wide Web Consortium）万维⽹联盟

6. BBS（Bulletin Board System）电⼦公告板

7. URL（Uniform Resource Locator）统⼀资源定位符

8. URN（Uniform Resource Name）统⼀资源标名称

9. URI（Uniform Resource Identifier）统⼀资源标识符

10. NPM（Node Package Manager）Node.js包管理器

11. XML（Extensible Markup Language）可扩展标记语⾔

12. DTD（Document Type Definition）⽂档类型定义

13. XHR（XMLHttpRequest）XMLHTTP的请求API函数

14. CSS（Cascading Style Sheets）层叠样式表

15. BFC（Block Formatting Context）块格式化上下⽂

16. RWD（Responsive Web Design）响应式Web设计

17. SVG（Scalable Vector Graphics）可缩放的⽮量图形

18. DOM（Document Object Model）⽂档对象模型

19. BOM（Browser Object Model）浏览器对象模型

20. NaN （Not a Number）⾮数字

21. MDN（Mozilla Developer Network）Mozilla开发者⽹络

22. MVC（Model View Controller）模型-视图-控制器

23. MVP（Model-View-Presenter）模型-视图-呈现

web前端开发工程师笔试题及答案

web前端开发工程师笔试题及答案

1 / 2

web前端开发工程师笔试题

1.html的含义是什么，其主体部分由什么标记构成？

Html是一种标准，一种规范，它通过标记符号来标记要显示在网页中的各个部分，被称为超文本标记语言。

标记和之间的内容构成了html的主体部分。网页中所有内容，包括文字，图片，连接都包含在此标记符内。

2.说明在网页设计xxDIV标签的作用

Div中文名被称为“层次”可以把文档分割成独立的，不同的部分。

它可以用作严格的组织工具，并且不适用任何格式与其他关联。

3.css指的是什么？在网页设计中为什么要用到css技术？

css是级联样式表，用来进行网页风格设计。使用样式表可以统一的控制html中各标志的显示属性。精确的确定元素的位置，扩充网页外观和特殊效果的显示能力。

4.css中id和class怎么定义，哪个定义的优先级别高？如果class定义一个html元素没边框，而id定义这个元素有边框，结果呢？

class=”a1”,id=”a2”>

先听id的。

5.IE6下为什么不能第一1PX左右高度的容器？

IE6默认的行高造成的。

6.怎样才能让层显示在FLASH之上？

给FLASH设置透明，param value=transparent。

7.怎样使一个层垂直剧中于浏览器中？

8. firefox嵌套div标签的剧中问题假定有如下情况：

2 / 2

解决办法就是除了需要在a中设置text-align属性为center之后，还需要设置b的横向margin为auto。例如设置b的CSS样式为：

margin:0 auto;

所以，设置如下就可以实现居中：

blue;width:30px;margin:0auto">

下载浏览速度快。被更多的用户访问。推广时被更多的机器访问。更少的代码，易于维护，宽带要求降低，降低成本，更容易被搜索引擎搜索到。改版方便，不需要改变内容。提供打印页面不用复制。

10.怎样解决超链接访问过后hover样式就不出现的问题。