前端工程师面试题题及答案全面综合

1. 要动态改变层中内容可以使用的方法有（AB ）a)innerHTMLb)innerTextc)通过设置层的隐藏和显示来实现d)通过设置层的样式属性的display属性2. 在javascript里，下列选项中不属于数组方法的是（B）；a)sort()b)length()c)concat()d)reverse()3 、var emp = new Array(3);for(var i in emp)以下答案中能与for循环代码互换的是: （选择一项）。

(D )A for(var i =0; i<emp; i++)B for(var i =0; i<Array(3); i++)C for(var i =0; i<(); i++)D for(var i =0; i<; i++)4 下列声明数组的语句中，错误的选项是（C ）。

a)Var arry= new Array()b)Var arry=new Array(3)c)Var arry[]=new Array(3)(4)d)Var arry=new Array(‘3’,’4’)5. 下列哪一个选项不属于document对象的方法?（D ）a)focus()b)getElementById()c)getElementsByName()d)bgColor()6. 、display属性值的常用取值不包括(C )a)inlineb)blockc)hiddend)none7. 以下有关pixelTop属性与top属性的说法正确的是。

(D )a)都是Location对象的属性b)使用时返回值都是字符串c)都是返回以像素为单位的数值d)以上都不对8. 使用open方法打开具有浏览器工具条,地址栏,菜单栏的窗口，下列选项正确的是__D__a)open("","HI","toolbas=1,scrollbars=1,status=1");b)open("HI","scrollbars=1,location=1,status=1");c)open("","status=yes,menubar=1,location=1");d)open("","HI","toolbas=yes,menubar=1,location=1");9. 、javascript中表达式parseInt(“X8X8”)+paseFloat(‘8’)的结果是什么?( C)a)8+8b)88c)16d)“8”+’810. 关于setTimeout(“check”,10)中说法正确的是( D)a)程序循环执行10次b)Check函数每10秒执行一次c)10做为参数传给函数checkd)Check函数每10毫秒执行一次二：11 link 和@import 的区别是？（1）link属于XHTML标签，而@import是CSS提供的;（2）页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载; （3）import只在IE5以上才能识别，而link是XHTML标签，无兼容问题;（4）link方式的样式的权重高于@import的权重.12 html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分HTML 和HTML5？* HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。

* 绘画 canvas用于媒介回放的 video 和 audio 元素本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失；sessionStorage 的数据在浏览器关闭后自动删除语意化更好的内容元素，比如 article、footer、header、nav、section表单控件，calendar、date、time、email、url、search新的技术webworker, websockt, Geolocation* 移除的元素纯表现的元素：basefont，big，center，font, s，strike，tt，u；对可用性产生负面影响的元素：frame，frameset，noframes；支持HTML5新标签：* IE8/IE7/IE6支持通过方法产生的标签，可以利用这一特性让这些浏览器支持HTML5新标签，浏览器支持新标签后，还需要添加标签默认的样式：* 当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架<!--[if lt IE 9]><script> src=""</script><![endif]-->如何区分： DOCTYPE声明\新增的结构元素\功能元素13 HTML5的离线储存？localStorage 长期存储数据，浏览器关闭后数据不丢失；sessionStorage 数据在浏览器关闭后自动删除。

14：介绍一下CSS的盒子模型？（1）有两种， IE 盒子模型、标准 W3C 盒子模型；IE的content部分包含了 border 和 pading; （2）盒模型：内容(content)、填充(padding)、边界(margin)、边框(border).15 CSS 选择器有哪些？哪些属性可以继承？优先级算法如何计算？CSS3新增伪类有那些？* 选择器（ # myid）2.类选择器（.myclassname）3.标签选择器（div, h1, p）4.相邻选择器（h1 + p）5.子选择器（ul < li）6.后代选择器（li a）7.通配符选择器（ * ）8.属性选择器（a[rel = "external"]）9.伪类选择器（a: hover, li: nth - child）* 可继承的样式： font-size font-family color, UL LI DL DD DT;* 不可继承的样式：border padding margin width height ;* 优先级就近原则，同权重情况下样式定义最近者为准;* 载入样式以最后载入的定位为准;优先级为:!important > id > class > tagimportant 比内联优先级高16 列出display的值，说明他们的作用。

position的值，relative和absolute定位原点是？1.block 象块类型元素一样显示。

none 缺省值。

象行内元素类型一样显示。

inline-block 象行内元素一样显示，但其内容象块类型元素一样显示。

list-item 象块类型元素一样显示，并添加样式列表标记。

2.*absolute生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。

*fixed （老IE不支持）生成绝对定位的元素，相对于浏览器窗口进行定位。

*relative生成相对定位的元素，相对于其正常位置进行定位。

* static 默认值。

没有定位，元素出现在正常的流中*（忽略 top, bottom, left, right z-index 声明）。

* inherit 规定从父元素继承 position 属性的值。

17 介绍js的基本数据类型。

number,string,boolean,object,undefined18 Javascript如何实现继承？通过原型和构造器19 什么是闭包（closure），为什么要用它？一、变量的作用域要理解闭包，首先必须理解Javascript特殊的变量作用域。

变量的作用域无非就是两种：全局变量和局部变量。

Javascript语言的特殊之处，就在于函数内部可以直接读取全局变量。

二、如何从外部读取局部变量？出于种种原因，我们有时候需要得到函数内的局部变量。

但是，前面已经说过了，正常情况下，这是办不到的，只有通过变通方法才能实现。

那就是在函数的内部，再定义一个函数。

三、闭包的概念上一节代码中的f2函数，就是闭包。

各种专业文献上的“闭包”（closure）定义非常抽象，很难看懂。

我的理解是，闭包就是能够读取其他函数内部变量的函数。

由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。

所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。

--------------------------------------------------------------------------------------------------------b四、闭包的用途闭包可以用在许多地方。

它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。

闭包的用途闭包可以用在许多地方。

它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。

20 针对jQuery 的优化方法？1，总是从ID选择器开始继承2，在class前使用tag(标签名)在jQuery中第二快的选择器是tag(标签)选择器( 比如：$(“head”) )。

跟ID选择器累时，因为它来自原生的getElementsByTagName() 方法。

继续看刚才那段HTML代码：比如需要选择红绿单选框，那么可以使用一个tag name来限制(修饰)class ，如下所示：var active_light = $(“”);当然也可以结合就近的ID，如下所示：var active_light = $(“#traffic_light ”);在使用tag来修饰class的时候，我们需要注意以下几点：（1）不要使用tag来修饰ID，如下所示：var content = $(“div#content”);这样一来，选择器会先遍历所有的div元素，然后匹配#content。

（好像jQuery从开始改变了选择器核心后，不存在这个问题了。

暂时无法考证。

）（2）不要画蛇添足的使用ID来修饰ID，如下所示：var traffic_light = $(“#content #traffic_light”);3，将jQuery对象缓存起来把jQuery对象缓存起来就是要告诉我们要养成将jQuery对象缓存进变量的习惯。

下面是一个jQuery新手写的一段代码：$("#traffic_light ").bind("click", function(){ });$("#traffic_light ").css("border", "1px dashed yellow");$("#traffic_light ").css("background-color", "orange");$("#traffic_light ").fadeIn("slow");但切记不要这么做。