14.html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分HTML和HTML5？
15.CSS引入的方式有哪些link和@import的区别是
内联内嵌外链导入
Link支持使用javascript改变样式，后者不可
16.CSS隐藏元素的几种方法（至少说出三种）
17.对BFC规范的理解？（W3CCSS2.1规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用。
多数显示器默认频率是60Hz，即1秒刷新60次，所以理论上最小间隔为1/60＊1000ms＝16.7ms19.display:inline-block什么时候会显示间隙？(携程)
移除空格、使用margin负值、使用font-size:0、letter-spacing、word-spacing20.iframe有那些缺点？*iframe会阻塞主页面的Onload事件；*iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。使用iframe之前需要考虑这两个缺点。如果需要使用iframe，最好是通过javascript动态给iframe添加src属性值，这样可以可以绕开以上两个问题。
21.介绍一下CSS的盒子模型？
22.CSS选择符有哪些？哪些属性可以继承？优先级算法如何计算？CSS3新增伪类有那些？
23.请问“resetting”和“normalizing”CSS之间的区别？你会如何选择，为什么？
24.请解释浮动(Floats)及其工作原理。
25.描述z-index和叠加上下文是如何形成的。
26.block，inline和inline-block的概念以及区别
27.你最喜欢的图片替换方法是什么，你如何选择使用。
28.使用CSS预处理器的优缺点有哪些？请描述你曾经使用过的CSS预处理器的优缺点。
29.什么是CSS预处理器/后处理器？
-预处理器例如：LESS、Sass、Stylus，用来预编译Sass或less，增强了css代码的复用性，还有层级、mixin、变量、循环、函数等，具有很方便的UI组件模块化开发能力，极大的提高工作效率。-后处理器例如：PostCSS，通常被视为在完成的样式表中根据CSS规范处理CSS，让其更有效；目前最常做的是给CSS属性添加浏览器私有前缀，实现跨浏览器兼容性的问题。
30.写出几种IE6BUG的解决方法
1.双边距BUGfloat引起的使用display：inline
2.3像素问题使用多个float和注释引起的使用dislpay:inline-3px
3.超链接hover点击后失效使用正确的书写顺序linkvisitedhoveractive4.Iez-index问题给父级添加position:relative5.PngIE下不透明问题使用js代码改6.Min-height最小高度问题！Important解决’7.select在ie6下遮盖使用iframe嵌套8.为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08,line-height:1px）
32.使用window.top.document.compatMode可显示为什么模式？
33.li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法？
行框的排列会受到中间空白（回车\空格）等的影响，因为空格也属于字符,这些空白也会被应用样式，占据空间，所以会有间隔，把字符大小设为0，就没有空格了。34.absolute的containingblock(容器块)计算方式跟正常流有什么不同？
无论属于哪种，都要先找到其祖先元素中最近的position值不为static的元素，然后再判断：1、若此元素为inline元素，则containingblock为能够包含这个元素生成的第一个和最后一个inlinebox的paddingbox(除margin,border外的区域)的最小矩形；2、否则,则由这个祖先元素的paddingbox构成。如果都找不到，则为initialcontainingblock。补充：1.static(默认的)/relative：简单说就是它的父元素的内容框（即去掉padding的部分）2.absolute:向上找最近的定位为absolute/relative的元素3.fixed:它的containingblock一律为根元素(html/body)，根元素也是initialcontainingblock35.CSS里的visibility属性有个collapse属性值是干嘛用的？在不同浏览器下以后什么区别？36.请解释一下CSS3的Flexbox（弹性盒布局模型）,以及适用场景？
CSS3的动画
JavaScript的动画
结论
38.你如何对网站的文件和资源进行优化期待的解决方案包括：文件合并文件最小化/文件压缩使用CDN托管缓存的使用
39.页面重构怎么操作？编写CSS、让页面结构更合理化，提升用户体验，实现良好的页面效果和提升性能。
40.常使用的库有哪些？常用的前端开发工具？开发过什么应用或组件？
41.说几条写JavaScript的基本规范？
43.webSocket如何兼容低浏览器？(阿里)
AdobeFlashSocket、ActiveXHTMLFile(IE)、基于multipart编码发送XHR、基于长轮询的XHR44.如何实现浏览器内多个标签页之间的通信(阿里)
1.例举3种强制类型转换和2种隐式类型转换强制（parseInt,parseFloat,number）隐式（==–===）
2.split()join()的区别前者是切割成数组的形式，后者是将数组转换成字符串
3.数组方法pop()push()unshift()shift()Push()尾部添加pop()尾部删除Unshift()头部添加shift()头部删除
4.JavaScript的数据对象有那些属性值？writable：这个属性的值是否可以改。configurable：这个属性的配置是否可以删除，修改。enumerable：这个属性是否能在for…in循环中遍历出来或在Object.keys中列举出来。value：属性值。
5.介绍js有哪些内置对象？
Object是JavaScript中所有对象的父对象数据封装类对象：Object、Array、Boolean、Number和String其他对象：Function、Arguments、Math、Date、RegExp、Error6.JavaScript原型，原型链有什么特点？*原型对象也是普通的对象，是对象一个自带隐式的__proto__属性，原型也有可能有自己的原型，如果一个原型对象的原型不为null的话，我们就称之为原型链。*原型链是由一些用来继承和共享属性的对象组成的（有限的）对象链。
7.JavaScript原型，原型链有什么特点？
1、构造继承2、原型继承3、实例继承4、拷贝继承原型prototype机制或apply和call方法去实现较简单，建议使用构造函数与原型混合方式。functionParent(){this.name='wang';}functionChild(){this.age=28;}Child.prototype=newParent();//继承了Parent，通过原型vardemo=newChild();alert(demo.age);alert(demo.name);//得到被继承的属性}9.Javascript中，有一个函数，执行时对象查找时，永远不会去查找原型，这个函数是？
hasOwnPropertyjavaScript中hasOwnProperty函数方法是返回一个布尔值，指出一个对象是否具有指定名称的属性。此方法无法检查该对象的原型链中是否具有该属性；该属性必须是对象本身的一个成员。使用方法：object.hasOwnProperty(proName)其中参数object是必选项。一个对象的实例。proName是必选项。一个属性名称的字符串值。如果object具有指定名称的属性，那么JavaScript中hasOwnProperty函数方法返回true，反之则返回false。10.Javascript作用链域
全局函数无法查看局部函数的内部细节，但局部函数可以查看其上层的函数细节，直至全局细节。当需要从局部函数查找某一属性或方法时，如果当前作用域没有找到，就会上溯到上层作用域查找，直至全局函数，这种组织形式就是作用域链。作用域链的作用是保证执行环境里有权访问的变量和函数是有序的，作用域链的变量只能向上访问，变量访问到window对象即被终止，作用域链向下访问变量是不被允许的。11.javascript创建对象的几种方式？
12.JavaScript有几种类型的值？，你能画一下他们的内存图吗？
13.IE和标准DOM事件流的区别1.执行顺序不一样、2.参数不一样3.事件加不加on4.this指向问题
14.IE和标准下有哪些兼容性的写法Varev=ev||window.eventdocument.documentElement.clientWidth||document.body.clientWidthVartarget=ev.srcElement||ev.target
15.new操作符具体干了什么呢1、创建一个空对象，并且this变量引用该对象，同时还继承了该函数的原型。2、属性和方法被加入到this引用的对象中。3、新创建的对象由this所引用，并且最后隐式的返回this。
varobj={};obj.__proto__=Base.prototype;Base.call(obj);16.null，undefined的区别？null表示一个对象被定义了，值为“空值”；undefined表示不存在这个值。
17.eval是做什么的？它的功能是把对应的字符串解析成JS代码并运行；避免使用eval，不安全，非常耗性能（2次，一次解析成js语句，一次执行）。
由JSON字符串转换为JSON对象的时候可以用eval，varobj=eval('('+str+')');
18.call和apply的区别Object.call(this,obj1,obj2,obj3)Object.apply(this,arguments)
19.当我们需要一个属性的时，Javascript引擎会先看当前对象中是否有这个属性，如果没有的话，就会查找他的Prototype对象是否有这个属性。
functionclone(proto){functionDummy(){}Dummy.prototype=proto;Dummy.prototype.constructor=Dummy;returnnewDummy();//等价于Object.create(Person);}functionobject(old){functionF(){};F.prototype=old;returnnewF();}varnewObj=object(oldObject);
20.写一个获取非行间样式的函数
functiongetStyle(obj,attr,value){if(!value){if(obj.currentStyle){returnobj.currentStyle(attr)}else{obj.getComputedStyle(attr,false)}}else{obj.style[attr]=value}}
21.["1","2","3"].map(parseInt)答案是多少？
[1,NaN,NaN]因为parseInt需要两个参数(val,radix)，其中radix表示解析时用的基数。map传了3个(element,index,array)，对应的radix不合法导致解析失败。
22.事件委托是什么？利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！
23.闭包是什么？有什么特性？对页面有什么影响？(很重要)
闭包是指有权访问另一个函数作用域中变量的函数，创建闭包的最常见的方式就是在一个函数内创建另一个函数，通过另一个函数访问这个函数的局部变量,利用闭包可以突破作用链域，将函数内部的变量和方法传递到外部。闭包的特性：1.函数内再嵌套函数2.内部函数可以引用外层的参数和变量3.参数和变量不会被垃圾回收机制回收执行say667()后,say667()闭包内部变量会存在,而闭包内部函数的内部变量不会存在.使得Javascript的垃圾回收机制GC不会收回say667()所占用的资源，因为say667()的内部函数的执行需要依赖say667()中的变量。这是对闭包作用的非常直白的描述.
functionsay667(){//Localvariablethatendsupwithinclosurevarnum=666;varsayAlert=function(){alert(num);}num++;returnsayAlert;}varsayAlert=say667();sayAlert()//执行结果应该弹出的667
24.如何判断一个对象是否属于某个类？
使用instanceof
if(ainstanceofPerson){alert('yes');}
25.如何阻止事件冒泡和默认事件？
functionstopBubble(e){if(e&&e.stopPropagation){e.stopPropagation()}else{window.event.cancelBubble=true}returnfalse}
jsonp:
functioncreateJs(sUrl){varoScript=document.createElement('script');oScript.type='text/javascript';oScript.src=sUrl;document.getElementsByTagName('head')[0].appendChild(oScript);}createJs('jsonp.js');box({'name':'test'});functionbox(json){alert(json.name);}
34.ajax是什么ajax的交互模型同步和异步的区别如何解决跨域问题1.通过异步模式，提升了用户体验2.优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用3.Ajax在客户端运行，承担了一部分本来由服务器承担的工作，减少了大用户量下的服务器负载。
跨域：jsonp、iframe、window.name、window.postMessage、服务器上设置代理页面
35.Ajax是什么如何创建一个Ajax？
ajax的全称：AsynchronousJavascriptAndXML。异步传输+js+xml。所谓异步，在这里简单地解释就是：向服务器发送请求的时候，我们不必等待结果，而是可以同时做其他的事情，等到有了结果它自己会根据设定进行后续操作，与此同时，页面是不会发生整页刷新的，提高了用户体验。(1)创建XMLHttpRequest对象,也就是创建一个异步调用对象(2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息(3)设置响应HTTP请求状态变化的函数(4)发送HTTP请求(5)获取异步调用返回的数据(6)使用JavaScript和DOM实现局部刷新
36.Ajax的最大的特点是什么？
Ajax可以实现动态不刷新（局部刷新）readyState属性状态有5个可取值：0=未初始化，1=正在加载2=已加载，3=交互中，4=完成ajax的缺点1、ajax不支持浏览器back按钮。2、安全问题AJAX暴露了与服务器交互的细节。3、对搜索引擎的支持比较弱。4、破坏了程序的异常机制。5、不容易调试。
37.ajax请求的时候get和post方式的区别？一个在url后面一个放在虚拟载体里面有大小限制安全问题应用不同一个是论坛等只需要请求的，一个是类似修改密码的
38.CORS
服务器端对于CORS的支持，主要就是通过设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置，就可以允许Ajax进行跨域的访问。
将子域和主域的document.domain设为同一个主域.前提条件：这两个域名必须属于同一个基础域名!而且所用的协议，端口都要一致，否则无法利用document.domain进行跨域
主域相同的使用document.domain
window对象有个name属性，该属性有个特征：即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的，每个页面对window.name都有读写的权限，window.name是持久存在一个窗口载入过的所有页面中的
还有flash、在服务器上设置代理页面等跨域方式。个人认为window.name的方法既不复杂，也能兼容到几乎所有浏览器，这真是极好的一种跨域方法。
39.模块化怎么做？立即执行函数,不暴露私有成员
varmodule1=(function(){var_count=0;varm1=function(){//...};varm2=function(){//...};return{m1:m1,m2:m2};})();
40.AMD（Modules/Asynchronous-Definition）、CMD（CommonModuleDefinition）规范区别？
AsynchronousModuleDefinition，异步模块定义，所有的模块将被异步加载，模块加载不影响后面语句运行。所有依赖某些模块的语句均放置在回调函数中。区别：1.对于依赖的模块，AMD是提前执行，CMD是延迟执行。不过RequireJS从2.0开始，也改成可以延迟执行（根据写法不同，处理方式不同）。CMD推崇aslazyaspossible.2.CMD推崇依赖就近，AMD推崇依赖前置。看代码：//CMDdefine(function(require,exports,module){vara=require('./a')a.doSomething()//此处略去100行varb=require('./b')//依赖可以就近书写b.doSomething()//...})//AMD默认推荐define(['./a','./b'],function(a,b){//依赖必须一开始就写好a.doSomething()//此处略去100行b.doSomething()//...})41.谈谈你对webpack的看法WebPack是一个模块打包工具，你可以使用WebPack管理你的模块依赖，并编绎输出模块们所需的静态文件。它能够很好地管理、打包Web开发中所用到的HTML、Javascript、CSS以及各种静态文件（图片、字体等），让开发过程更加高效。对于不同类型的资源，webpack有对应的模块加载器。webpack模块打包器会分析模块间的依赖关系，最后生成了优化且合并后的静态资源。
webpack的两大特色：
1.codesplitting（可以自动完成）2.loader可以处理各种类型的静态文件，并且支持串联操作webpack是以commonJS的形式来书写脚本滴，但对AMD/CMD的支持也很全面，方便旧项目进行代码迁移。
webpack具有requireJs和browserify的功能，但仍有很多自己的新特性：
UDP（UserDataProtocol，用户数据报协议）是与TCP相对应的协议。它是面向非连接的协议，它不与对方建立连接，而是直接就把数据包发送过去！UDP适用于一次只传送少量数据、对可靠性要求不高的应用环境。
43.对Node的优点和缺点提出了自己的看法：*（优点）因为Node是基于事件驱动和无阻塞的，所以非常适合处理并发请求，因此构建在Node上的代理服务器相比其他技术实现（如Ruby）的服务器表现要好得多。此外，与Node代理服务器交互的客户端代码是由javascript语言编写的，因此客户端和服务器端都用同一种语言编写，这是非常美妙的事情。*（缺点）Node是一个相对新的开源项目，所以不太稳定，它总是一直在变，而且缺少足够多的第三方库支持。看起来，就像是Ruby/Rails当年的样子。
44.如何判断当前脚本运行在浏览器还是node环境中？（阿里）
通过判断Global对象是否为window，如果不为window，当前脚本没有运行在浏览器中
45.javascript的本地对象，内置对象和宿主对象？本地对象为arrayobjregexp等可以new实例化内置对象为gloadMath等不可以实例化的宿主为浏览器自带的document,window等
46.documentload和documentready的区别？Document.onload是在结构和样式加载完才执行jsDocument.ready原生中没有这个方法，jquery中有$().ready(function)
47.”==”和“===”的不同？前者会自动转换类型后者不会
49.编写一个b继承a的方法;
functionA(name){this.name=name;this.sayHello=function(){alert(this.name+”sayHello!”);};}functionB(name,id){this.temp=A;this.temp(name);//相当于newA();deletethis.temp;this.id=id;this.checkId=function(ID){alert(this.id==ID)};}
functionfun(n,o){console.log(o)return{fun:function(m){returnfun(m,n);}};}vara=fun(0);a.fun(1);a.fun(2);a.fun(3);varb=fun(0).fun(1).fun(2).fun(3);varc=fun(0).fun(1);c.fun(2);c.fun(3);//答案：//a:undefined,0,0,0//b:undefined,0,1,2//c:undefined,0,1,1
/***对象克隆*支持基本数据类型及对象*递归方法*/functionclone(obj){varo;switch(typeofobj){case"undefined":break;case"string":o=obj+"";break;case"number":o=obj-0;break;case"boolean":o=obj;break;case"object"://object分为两种情况对象（Object）或数组（Array）if(obj===null){o=null;}else{if(Object.prototype.toString.call(obj).slice(8,-1)==="Array"){o=[];for(vari=0;i52.如何消除一个数组里面重复的元素？vararr1=[1,2,2,2,3,3,3,4,5,6],arr2=[];for(vari=0,len=arr1.length;ivarstr="aaaabbbccccddfgh";varobj={};for(vari=0;ivarquickSort=function(arr){if(arr.length<=1){returnarr;}varpivotIndex=Math.floor(arr.length/2);varpivot=arr.splice(pivotIndex,1)[0];varleft=[];varright=[];for(vari=0;i58.列举IE与其他浏览器不一样的特性？
1、事件不同之处：触发事件的元素被认为是目标（target）。而在IE中，目标包含在event对象的srcElement属性；获取字符代码、如果按键代表一个字符（shift、ctrl、alt除外），IE的keyCode会返回字符代码（Unicode），DOM中按键的代码和字符是分离的，要获取字符代码，需要使用charCode属性；阻止某个事件的默认行为，IE中阻止某个事件的默认行为，必须将returnValue属性设置为false，Mozilla中，需要调用preventDefault()方法；停止事件冒泡，IE中阻止事件进一步冒泡，需要设置cancelBubble为true，Mozzilla中，需要调用stopPropagation()；59.JavaScript实现二分法查找二分法查找，也称折半查找，是一种在有序数组中查找特定元素的搜索算法。查找过程可以分为以下步骤：（1）首先，从有序数组的中间的元素开始搜索，如果该元素正好是目标元素（即要查找的元素），则搜索过程结束，否则进行下一步。（2）如果目标元素大于或者小于中间元素，则在数组大于或小于中间元素的那一半区域查找，然后重复第一步的操作。（3）如果某一步数组为空，则表示找不到目标元素。参考代码:
//非递归算法functionbinary_search(arr,key){varlow=0,high=arr.length-1;while(low<=high){varmid=parseInt((high+low)/2);if(key==arr[mid]){returnmid;}elseif(key>arr[mid]){low=mid+1;}elseif(keyhigh){return-1;}varmid=parseInt((high+low)/2);if(arr[mid]==key){returnmid;}elseif(arr[mid]>key){high=mid-1;returnbinary_search(arr,low,high,key);}elseif(arr[mid]60.ajax请求时，如何解释json数据.61.你所了解到的Web攻击技术（1）XSS（Cross-SiteScripting，跨站脚本攻击）：指通过存在安全漏洞的Web网站注册用户的浏览器内运行非法的HTML标签或者JavaScript进行的一种攻击。（2）SQL注入攻击（3）CSRF（Cross-SiteRequestForgeries，跨站点请求伪造）：指攻击者通过设置好的陷阱，强制对已完成的认证用户进行非预期的个人信息或设定信息等某些状态更新。62.写一个function，清除字符串前后的空格。（兼容所有浏览器）functiontrim(str){if(str&&typeofstr==="string"){returnstr.replace(/(^\s*)|(\s*)$/g,"");//去除前后空白符}}
(HTTP、正则、优化、重构、响应式、移动端、团队协作、SEO、UED、职业生涯)
varreg=/^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/;varemail="example@qq.com";console.log(reg.test(email));//true
一般情况下是指私钥用于对数据进行签名，公钥用于对签名进行验证;HTTP网站在浏览器端用公钥加密敏感数据，然后在服务器端再用私钥解密。
网站重构：在不改变外部行为的前提下，简化结构、添加可读性，而在网站前端保持一致的行为。也就是说是在不改变UI的情况下，对网站进行优化，在扩展的同时保持一致的UI。对于传统的网站来说重构通常是：表格(table)布局改为DIV+CSS使网站前端兼容于现代浏览器(针对于不合规范的CSS、如对IE6有效的)对于移动平台的优化针对于SEO进行优化深层次的网站重构应该考虑的方面减少代码间的耦合让代码保持弹性严格按规范编写代码设计可扩展的API代替旧有的框架、语言(如VB)增强用户体验通常来说对于速度的优化也包含在重构中压缩JS、CSS、image等前端资源(通常是由服务器来解决)程序的性能优化(如数据读写)采用CDN来加速资源加载对于JSDOM的优化HTTP服务器的文件缓存75.WhatisaPolyfill
polyfill是“在旧版浏览器上复制标准API的JavaScript补充”,可以动态地加载JavaScript代码或库，在不支持这些标准API的浏览器中模拟它们。例如，geolocation（地理位置）polyfill可以在navigator对象上添加全局的geolocation对象，还能添加getCurrentPosition函数以及“坐标”回调对象，所有这些都是W3C地理位置API定义的对象和函数。因为polyfill模拟标准API，所以能够以一种面向所有浏览器未来的方式针对这些API进行开发，一旦对这些API的支持变成绝对大多数，则可以方便地去掉polyfill，无需做任何额外工作。76.检测浏览器版本版本有哪些方式？
功能检测、userAgent特征检测比如：navigator.userAgent//"Mozilla/5.0(Macintosh;IntelMacOSX10_10_2)AppleWebKit/537.36(KHTML,likeGecko)Chrome/41.0.2272.101Safari/537.36"77.用js实现千位分隔符(提示：正则+replace)functioncommafy(num){num=num+'';varreg=/(-d+)(d{3})/;if(reg.test(num)){num=num.replace(reg,'$1,$2');}returnnum;}
