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

1、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 src=“http:/ 如何区分： DOCTYPE 声明新增的结构元素功能元素1

2、3 HTML5 的离线储存？localStorage 长期存储数据，浏览器关闭后数据不丢失；sessionStorage 数据在浏览器关闭后自动删除。14：介绍一下 CSS 的盒子模型？（1）有两种， IE 盒子模型、标准 W3C 盒子模型；IE 的 content 部分包含了 border 和 pading;（2）盒模型： 内容(content) 、填充(padding) 、边界(margin)、 边框(border).15 CSS 选择器有哪些？哪些属性可以继承？优先级算法如何计算？ CSS3 新增伪类有那些？* 1.id 选择器（ # myid）2.类选择器（ .myclassname）

3、3.标签选择器（ div, h1, p）4.相邻选择器（ h1 + p）5.子选择器（ ul id class tag important 比 内联优先级高16 列出 display 的值，说明他们的作用。position 的值， relative 和 absolute 定位原点是？1. block 象块类型元素一样显示。none 缺省值。象行内元素类型一样显示。inline-block 象行内元素一样显示，但其内容象块类型元素一样显示。list-item 象块类型元素一样显示，并添加样式列表标记。2. *absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定

4、位。 *fixed （老 IE 不支持）生成绝对定位的元素，相对于浏览器窗口进行定位。*relative 生成相对定位的元素，相对于其正常位置进行定位。* static 默认值。没有定位，元素出现在正常的流中*（忽略 top, bottom, left, right z-index 声明）。* inherit 规定从父元素继承 position 属性的值。17 介绍 js 的基本数据类型。number,string,boolean,object,undefined18 Javascript 如何实现继承？通过原型和构造器19 什么是闭包（closure），为什么要用它？一、变量的作用域要理解闭

5、包，首先必须理解 Javascript 特殊的变量作用域。变量的作用域无非就是两种：全局变量和局部变量。Javascript 语言的特殊之处，就在于函数内部可以直接读取全局变量。二、如何从外部读取局部变量？出于种种原因，我们有时候需要得到函数内的局部变量。但是，前面已经说过了，正常情况下，这是办不到的，只有通过变通方法才能实现。那就是在函数的内部，再定义一个函数。三、闭包的概念上一节代码中的 f2 函数，就是闭包。各种专业文献上的“闭包” （closure ）定义非常抽象，很难看懂。我的理解是，闭包就是能够读取其他函数内部变量的函数。由于在 Javascript 语言中，只有函数内部的子函数才

6、能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。-b四、闭包的用途闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。闭包的用途闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。20 针对 jQuery 的优化方法？1，总是从 ID 选择器开始继承2，在 class 前使用 tag(标签名)在 jQuery 中第二快的选择器是 tag(标签)选择器( 比如：$(“h

7、ead ”) )。跟 ID 选择器累时，因为它来自原生的 getElementsByTagName() 方法。继续看刚才那段 HTML 代码：比如需要选择 红绿 单选框，那么可以使用一个 tag name 来限制(修饰)class ，如下所示：var active_light = $(“input.on”);当然也可以结合 就近的 ID，如下所示：var active_light = $(“#traffic_light input.on”);在使用 tag 来修饰 class 的时候，我们需要注意以下几点：（1） 不要使用 tag 来修饰 ID，如下所示：var content = $(“di

8、v#content”);这样一来，选择器会先遍历所有的 div 元素，然后匹配#content。（好像 jQuery 从 1.3.1 开始改变了选择器核心后，不存在这个问题了。暂时无法考证。）（2）不要画蛇添足的使用 ID 来修饰 ID，如下所示：var traffic_light = $(“#content #traffic_light”);3，将 jQuery 对象缓存起来把 jQuery 对象缓存起来 就是要告诉我们 要养成将 jQuery 对象缓存进变量的习惯。下面是一个 jQuery 新手写的一段代码：$(“#traffic_light input.on“).bind(“click“

9、, function() );$(“#traffic_light input.on“).css(“border“, “1px dashed yellow“);$(“#traffic_light input.on“).css(“background-color“, “orange“);$(“#traffic_light input.on“).fadeIn(“slow“);但切记不要这么做。我们应该先将对象缓存进一个变量然后再操作，如下所示：var $active_light = $(“#traffic_light input.on“);$active_light.bind(“click“, fu

10、nction() );$active_light.css(“border“, “1px dashed yellow“);$active_light.css(“background-color“, “orange“);$active_light.fadeIn(“slow“);记住，永远不要让相同的选择器在你的代码里出现多次.4，对直接的 DOM 操作进行限制这里的基本思想是在内存中建立你确实想要的东西，然后更新 DOM 。这并不是一个 jQuery 最佳实践，但必须进行有效的 JavaScript 操作 。直接的 DOM 操作速度很慢。例如，你想动态的创建一组列表元素，千万不要这样做,如下所示：

11、var top_100_list = , / 假设这里是 100 个独一无二的字符串$mylist = $(“#mylist“); / jQuery 选择到 元素for (var i=0, l=top_100_list.length; i“ + top_100_listi + “);我们应该将整套元素字符串在插入进 dom 中之前先全部创建好，如下所示：var top_100_list = ,$mylist = $(“#mylist“), top_100_li = “; / 这个变量将用来存储我们的列表元素for (var i=0, l=top_100_list.length; i“;$myl

12、ist.html(top_100_li);5，冒泡除非在特殊情况下, 否则每一个 js 事件( 例如:click, mouseover 等.)都会冒泡到父级节点。当我们需要给多个元素调用同个函数时这点会很有用。代替这种效率很差的多元素事件监听的方法就是, 你只需向它们的父节点绑定一次。比如, 我们要为一个拥有很多输入框的表单绑定这样的行为: 当输入框被选中时为它添加一个 class传统的做法是，直接选中 input，然后绑定 focus 等，如下所示：$(“#entryform input“).bind(“focus“, function()$(this).addClass(“selected

13、“);).bind(“blur“, function()$(this).removeClass(“selected“););当然上面代码能帮我们完成相应的任务，但如果你要寻求更高效的方法，请使用如下代码：$(“#entryform“).bind(“focus“, function(e)var $cell = $(e.target); / e.target 捕捉到触发的目标元素$cell.addClass(“selected“);).bind(“blur“, function(e)var $cell = $(e.target);$cell.removeClass(“selected“););通过

14、在父级监听获取焦点和失去焦点的事件，对目标元素进行操作。在上面代码中，父级元素扮演了一个调度员的角色, 它可以基于目标元素绑定事件。如果你发现你给很多元素绑定了同一个事件监听, 那么现在的你肯定知道哪里做错了。6，推迟到 $(window).loadjQuery 对于开发者来说有一个很诱人的东西, 可以把任何东西挂到$(document).ready 下。尽管$(document).rady 确实很有用， 它可以在页面渲染时，其它元素还没下载完成就执行。如果你发现你的页面一直是载入中的状态，很有可能就是$(document).ready 函数引起的。你可以通过将 jQuery 函数绑定到$(w

15、indow).load 事件的方法来减少页面载入时的 cpu 使用率。它会在所有的 html(包括 iframe)被下载完成后执行。一些特效的功能，例如拖放, 视觉特效和动画, 预载入隐藏图像等等，都是适合这种技术的场合。7，压缩 JavaScript在线压缩地址: http:/dean.edwards.name/packer/压缩之前，请保证你的代码的规范性，否则可能失败，导致 Js 错误。8，尽量使用 ID 代替 Class。前面性能优化已经说过，ID 选择器的速度是最快的。所以在 HTML 代码中，能使用 ID 的尽量使用 ID 来代替 class。9，给选择器一个上下文jQuery 选择器中有一个这样的选择器，它能指定上下文。jQuery( expression, context );通过它，能缩小选择器在 DOM 中搜索的范围，达到节省时间，提高效率。普通方式：$(.myDiv)改进方式：$(.myDiv , $(“#listItem“) )10，慎用 .live()方法（应该说尽量不要使用）这是 jQuery1.3.1 版本之后增加的方法，这个方法的功能就是为 新增的 DOM 元素 动态绑定事件。但对于效率来说，这个方法比较占用资源。所以请尽量不要使用它。