收藏 分销(赏)

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

上传人:鼓*** 文档编号:11234401 上传时间:2025-07-09 格式:DOC 页数:8 大小:35.04KB 下载积分:8 金币
下载 相关 举报
前端工程师面试题题及答案(全面综合).doc_第1页
第1页 / 共8页
前端工程师面试题题及答案(全面综合).doc_第2页
第2页 / 共8页


点击查看更多>>
资源描述
1。 要动态改变层中内容可以使用的方法有(AB ) a)innerHTML b)innerText c)通过设置层的隐藏和显示来实现 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〈emp。length(); i++) D for(var i =0; i<emp.length; 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)inline b)block c)hidden d)none 7. 以下有关pixelTop属性与top属性的说法正确的是.(D ) a)都是Location对象的属性 b)使用时返回值都是字符串 c)都是返回以像素为单位的数值 d)以上都不对 8. 使用open方法打开具有浏览器工具条,地址栏,菜单栏的窗口,下列选项正确的是__D__ a)open(”x.html",”HI”,”toolbas=1,scrollbars=1,status=1"); b)open(”HI","scrollbars=1,location=1,status=1”); c)open(”x。html",”status=yes,menubar=1,location=1”); d)open("x。html”,"HI”,"toolbas=yes,menubar=1,location=1"); 9. 、 javascript中表达式parseInt(“X8X8”)+paseFloat(‘8’)的结果是什么?( C) a)8+8 b)88 c)16 d)“8”+’8 10。 关于setTimeout(“check",10)中说法正确的是( D) a)程序循环执行10次 b)Check函数每10秒执行一次 c)10做为参数传给函数check d)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支持通过document.createElement方法产生的标签, 可以利用这一特性让这些浏览器支持HTML5新标签, 浏览器支持新标签后,还需要添加标签默认的样式: * 当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架 <!——[if lt IE 9]〉 <script〉 src=”http://html5shim.googlecode。com/svn/trunk/html5.js"</script〉 <![endif]--> 如何区分: DOCTYPE声明\新增的结构元素\功能元素 13 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。标签选择器(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 〉 tag important 比 内联优先级高 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,undefined 18 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 = $(“input。on”); 当然也可以结合 就近的ID,如下所示: var active_light = $(“#traffic_light input。on”); 在使用tag来修饰class的时候,我们需要注意以下几点: (1) 不要使用tag来修饰ID,如下所示: var content = $(“div#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”, 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”, function(){ }); $active_light.css("border”, ”1px dashed yellow"); $active_light。css(”background-color”, ”orange"); $active_light.fadeIn(”slow"); 记住,永远不要让相同的选择器在你的代码里出现多次。 4,对直接的DOM操作进行限制 这里的基本思想是在内存中建立你确实想要的东西,然后更新DOM 。 这并不是一个jQuery最佳实践,但必须进行有效的JavaScript操作 。直接的DOM操作速度很慢. 例如,你想动态的创建一组列表元素,千万不要这样做,如下所示: var top_100_list = [], // 假设这里是100个独一无二的字符串 $mylist = $("#mylist”); // jQuery 选择到 元素 for (var i=0, l=top_100_list。length; i” + top_100_list[i] + ""); } 我们应该将整套元素字符串在插入进dom中之前先全部创建好,如下所示: var top_100_list = [],$mylist = $("#mylist"), top_100_li = "”; // 这个变量将用来存储我们的列表元素 for (var i=0, l=top_100_list.length; i"; } $mylist.html(top_100_li); 5,冒泡 除非在特殊情况下, 否则每一个js事件(例如:click, mouseover等.)都会冒泡到父级节点。 当我们需要给多个元素调用同个函数时这点会很有用。 代替这种效率很差的多元素事件监听的方法就是, 你只需向它们的父节点绑定一次. 比如, 我们要为一个拥有很多输入框的表单绑定这样的行为: 当输入框被选中时为它添加一个class 传统的做法是,直接选中input,然后绑定focus等,如下所示: $("#entryform input")。bind(”focus", function(){ $(this).addClass("selected"); })。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”); }); 通过在父级监听获取焦点和失去焦点的事件,对目标元素进行操作. 在上面代码中,父级元素扮演了一个调度员的角色, 它可以基于目标元素绑定事件. 如果你发现你给很多元素绑定了同一个事件监听, 那么现在的你肯定知道哪里做错了。 6,推迟到 $(window)。load jQuery对于开发者来说有一个很诱人的东西, 可以把任何东西挂到$(document).ready下。 尽管$(document).rady 确实很有用, 它可以在页面渲染时,其它元素还没下载完成就执行. 如果你发现你的页面一直是载入中的状态,很有可能就是$(document).ready函数引起的。 你可以通过将jQuery函数绑定到$(window)。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元素 动态绑定事件. 但对于效率来说,这个方法比较占用资源.所以请尽量不要使用它。
展开阅读全文

开通  VIP会员、SVIP会员  优惠大
下载10份以上建议开通VIP会员
下载20份以上建议开通SVIP会员


开通VIP      成为共赢上传

当前位置:首页 > 考试专区 > 其他

移动网页_全站_页脚广告1

关于我们      便捷服务       自信AI       AI导航        抽奖活动

©2010-2026 宁波自信网络信息技术有限公司  版权所有

客服电话:0574-28810668  投诉电话:18658249818

gongan.png浙公网安备33021202000488号   

icp.png浙ICP备2021020529号-1  |  浙B2-20240490  

关注我们 :微信公众号    抖音    微博    LOFTER 

客服