前端面试题集合

面试题集合前端1.Html1).谈谈你对Web标准的理解。WEB标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：1.结构（Structure）结构化标准语言主要包括XHTML和XML2.表现（Presentation）表现标准语言主要包括CSS3.行为（Behavior）行为标准主要包括对象模型（如W3CDOM）、ECMAScript并要求这三部分分离。这些标准大部分由W3C起草和发布，也有一些是其他标准组织制订的标准，比如ECMA（EuropeanComputerManufacturersAssociation）的ECMAScript标准。2).列举Html中的至少3个实体。&、 、<、>、®、©3).cellpadding与cellspacing有何区别？cellpadding：代表单元格边框到内容之间的距离（留白）cellspacing：代表单元格间边框，以及和table边框之间的距离4).列举常用的CSS选择器ID、元素、class、伪类、组、包含、子等5).display与visibility有何异同？display可以有很多值，visibility只有两个常用值：visible、hidden。当display为none、visibility为hidden时都会隐藏元素。但display会隐藏掉元素空间，visibility会保留元素空间。6).怎么在网页中实现绝对定位？将position设置为：absolute7).table-layout、border-collapse有何用途？table-layout：设置表格是否自动调整宽高border-collapse：表格与单元格及单元格间的边框是否融合在一起。8).简述盒模型9).链接标记target属性的_top、_parent、_blank、main、left、top各有何用处?_top：在顶层window中打开链接；_parent：在包含当前frame的父window中打开链接_blank：在新window中打开链接main、left、top是由AdobeDreamweaver生成的主、左、上框架集的框架默认名。10).你对浏览器兼容怎么看？通常你都做哪些处理？浏览器兼容就是要在兼容的浏览器上都显示大致甚至完全相同的界面。由于每种浏览器都有不同的特性，且现在的浏览器又非常多所以浏览器兼容是一个非常恼火的事情，如果是企业内部管理系统，通常都只针对一到两种浏览器开发，以降低开发成本。如果要做浏览器兼容的话，就分两种情况：第一种是企业内部系统：通常会采用一些现成的UI技术，如ext、flex或其它UI框架完成。这些技术自己已经有相当好的浏览器兼容了。第二种是互联网的：通常也会采用一些JS框架作辅助，如jQuery等作对dom、事件、ajax的兼容，页面上使用hack技术，如IE的*开始的选择器和条件注释作兼容。11).get和post的区别？Form中的get和post方法，在数据传输过程中分别对应了HTTP协议中的GET和POST方法。二者主要区别如下：1）Get是用来从服务器上获得数据，而Post是用来向服务器上传递数据；2）Get将表单中数据按照variable=value的形式，添加到action所指向的URL后面，并且两者使用“?”连接，而各个变量之间使用“&”连接；Post是将表单中的数据放在form的数据体中，按照变量和值相对应的方式，传递到action所指向URL；3）Get是不安全的，因为在传输过程，数据被放在请求的URL中；Post的所有操作对用户来说都是不可见的；4）Get传输的数据量小，这主要是因为受URL长度限制；而Post可以传输大量的数据，所以在上传文件只能使用Post；5）Get限制Form表单的数据集必须为ASCII字符，而Post支持整个ISO10646字符集；6）Get是Form的默认方法。12).有如下Html代码，要求：不改变html代码，增加css，改变header颜色；写出js代码删除表格第2列。tabletrth /thth /thth /th/trtrtd /tdtd /tdtd /td/trtrtd /tdtd /tdtd /td/tr/table2.Html51).Html5与html4相比，各有何优缺点？3.Javascript1).JS的如何使页面跳转?怎么引入一个外部JS文件?2).输入框的验证用什么事件?3).undefined与null有何异同？相同点：它们都表示空，转换为boolean后都为false不同点：null代表一个对象变量已经被初始化，但未装入对象；undefined表示未初始化变量4).===与==有何异同？相同点：都是判定两个值是否相等不同点：==不会判断类型，而===会判断类型5).如何判断一个变量的值是否为数字？以及有哪些手段判断变量值的数据类型？全局函数isNaN可以判断一个变量的值是否为数字。可以使用运算符type、instanceof判断变量值的数据类型。6).什么是Bom什么是Dom?你如何理解Dom?Bom指浏览器对象，Dom指文档模型中定义的对象。7).Array的join、push、splice、slice各有何用途，splice与slice有何异同？join：使用指定间隔符连接所有元素为字符串push：在尾部添加元素并维护array实例的lengthsplice与slice都是截取一部分元素。不同的在于：slice返回截取后的新实例，splice在原array实例上操作。8).如何阻止表单提交？在onsubmit事件中返回false9).如何动态操作表格？可以象普通dom一样操作，但是因为表格的dom比较复杂，所以我通常是使用table的insertRow、deleteRow及tr对象的insetCell、deleteCell操作。10).String.match与RegExp.exec有何区别？match只会返回没有分组的全部匹配结果或者有分组的第一次匹配结果；而exec可以利用循环返回全部匹配结果。11).为验证合法标识符、验证手机号各写一个正则。12).正则的i标记与g标记各有何用途？i：不区分大小写；g：全局匹配，如果没有此标记，正则不会第二个之后的结果。13).为String添加trim()方法。String.prototype.trim=function(){returnthis.replace(/^+|+$/g,);}14).简述COOKIE。在JS中如何操作Cookie?使用document.cookie操作。15).谈谈javascript数组排序方法sort()的使用，重点介绍sort()参数的使用及其内部机制。调用默认排序：[].sort()；调用自定义排序：[].sort(function(){return0;//返回0，正数，负数分别代表与比较的数相等，比它大或小。});16).谈谈innerHTMLouterHTMLinnerText之间的区别。innerHTML是w3c的htmldom定义的方法，而后两者是IE独有的方法；innerHTML代表一个元素节点内由所有子节点，不包括当前节点组成的html代码；outerHTML代表一个元素节点内由所有子节点和当前节点组成的html代码；innerText代表一个元素节点内由所有子文本节点内容组成的文本；17).在JavaScript中定时调用函数foo()如何写？setTimeout(foo,1000//这里设置延时数);18).setTimeout与setInterval有何区别?19).你在js中用过array吗？如果用过，array中添加数据用什么方法？用过。在尾部添加使用push()；在头部添加使用unshift()；在任意位置添加使用splice()，但要注意把它的删除个数设置为0。20).简述javascript的优缺点。优点：简单易用，与Java有类似的语法，可以使用任何文本编辑工具编写，只需要浏览器就可执行程序，并且事先不用编译，逐行执行，无需进行严格的变量声明，而且内置大量现成对象，编写少量程序可以完成目标；缺点：不适合开发大型应用程序；21).Javascript有哪些内置对象?只有Math和Global（在浏览器环境中，Global就是Window）22).列举Javascript的本地对象。Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、SyntaxError、TypeError、URIError23).你试过自己写Java类库或Js类库吗？谈谈当初你是怎么写的或者你写类库的思路。4.Ajax1).如何使用Ajax从服务器获取复杂数据？2).什么是Ajax？Ajax（AsynchronousJavaScript+XML），即异步JavaScript+XML的缩写，主要用来页面异步刷新，也是构建RIA的一种基础技术。3).解释XMLHttpRequest是什么？XMLHttpRequest，是我们得以实现异步通讯的根本。最早在IE5中以ActiveX组件实现；最近，Mozilla1.0和Safari1.2中实现为本地对象。XMLHttpRequest虽然不是W3C标准，但却得到了FireFox、Safari、Opera、Konqueror、IE等绝大多数浏览器的支持。4).谈谈你对Ajax的理解。你在项目中如何使用Ajax？手写一个简单的Ajax操作。Ajax（AsynchronousJavaScript+XML），即异步JavaScript+XML的缩写，主要用来页面异步刷新，也是构建RIA的一种基础技术。因为它涉及浏览器兼容、跨域等问题，在项目中一般会使用一些基础类库辅助实现，如jQuery等。一个简单的Ajax操作如下。varxhr=newXMLHttpRequest();//在环境中需要做浏览器兼容，这里省略了。。xhr.onreadystatechange=function(){//这里注册当xhr状态发生改变后调用事件if(xhr.readyState==4){//通常在读取状态为4的时候才能获取到部分数据，所以一般状态在4的时候才进//行处理if(status==200){//当正常请求到资源时的处理,可以调用xhr.responseText或//xhr.responseXml获取数据}else{//当请求资源失败时的处理}}}xhr.open(GET,url);//设置xhr的请求方式和url,这里使用的是GET方式，//如果有参数，则连接在url后面/*如果是POST请求，还当设置请求的Content-Type数据使用send作为参数发送*/xhr.send();5).谈谈你对JSON的理解。JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于JavaScriptProgrammingLanguage,StandardECMA-2623rdEdition-December1999的一个子集。JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C,C++,C#,Java,JavaScript,Perl,Python等）。这些特性使JSON成为理想的数据交换语言。所以它往往在AJAX中替代XML，交换数据。6).你的项目中有使用到跨域吗？你在项目中是如何处理JS跨域问题的？有。一个网站，主要是使用其它网站提供的javascripapi