web前端面试题

Javascript

1.javascript的typeof返回哪些数据类型

      Object number function boolean underfind

 

2.例举3种强制类型转换和2种隐式类型转换?

      强制（parseInt,parseFloat,number）

      隐式（==– ===）

 

3.split() join()的区别

      前者是切割成数组的形式，后者是将数组转换成字符串

 

4.数组方法pop() push() unshift() shift()

      Push()尾部添加pop()尾部删除

      Unshift()头部添加shift()头部删除

 

5.事件绑定和普通事件有什么区别

     事件绑定就是针对dom元素的事件，绑定在dom元素上

       普通事件即为非针对dom元素的事件;

       例如：

       普通事件

       var btn = document.getElementById("hello");

       btn.onclick = function(){

       alert(1);

       };

       btn.onclick = function(){

       alert(2);

       }; //这个事件只会弹出2;

       事件绑定

       var btn = document.getElementById("hello");

      btn.addEventListener("click",function(){

      alert(1);

      },false);

      btn.addEventListener("click",function(){

      alert(2);

      },false); //这个事件首先会弹出1，然后在弹出2;

 

 

6.IE和DOM事件流的区别

         1.执行顺序不一样、

         2.参数不一样

         3.事件加不加on

         4.this指向问题

 

7.IE和标准下有哪些兼容性的写法

         Var ev = ev || window.event

         document.documentElement.clientWidth || document.body.clientWidth

         Var target = ev.srcElement||ev.target

 

8.ajax请求的时候get和post方式的区别

        一个在url后面 一个放在虚拟载体里面有大小限制

        安全问题 应用不同一个是论坛等只需要请求的，一个是类似修改密码的

 

9.call和apply的区别

       Object.call(this,obj1,obj2,obj3)

       Object.apply(this,arguments)

 

10.ajax请求时，如何解释json数据

      使用eval parse鉴于安全性考虑 使用parse更靠谱

11.b继承a的方法

 

 

12.写一个获取非行间样式的函数

 

function getStyle(obj,attr,value)

{

if(!value)

{

if(obj.currentStyle)

{

return obj.currentStyle(attr)

}

else

{

obj.getComputedStyle(attr,false)

}

}

else

{

obj.style[attr]=value

}

}

 

13.事件委托是什么

    让利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！

    http://www.webasily.com/?p=78例子可见此链接

 

14.闭包是什么，有什么特性，对页面有什么影响

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

      http://blog.csdn.net/gaoshanwudi/article/details/7355794此链接可查看

      这个问题我同学面试问到过。

15.如何阻止事件冒泡和默认事件

      canceBubble return false

 

16.添加 删除 替换 插入到某个接点的方法

      obj.appendChidl()

      obj.innersetBefore

      obj.replaceChild

      obj.removeChild

 

17.解释jsonp的原理，以及为什么不是真正的ajax

      动态创建script标签，回调函数

      Ajax是页面无刷新请求数据操作

 

18.javascript的本地对象，内置对象和宿主对象

      本地对象为array obj regexp等可以new实例化

      内置对象为gload Math等不可以实例化的

      宿主为浏览器自带的document,window等

 

19.document load和document ready的区别

      Document.onload是在结构和样式加载完才执行js

      Document.ready原生种没有这个方法，jquery中有$().ready(function)

 

20.”==”和“===”的不同

      前者会自动转换类型后者不会

 

21.javascript的同源策略

      一段脚本只能读取来自于同一来源的窗口和文档的属性，这里的同一来源指的是主机名、协议和端口号的组合

 

22.编写一个数组去重的方法

function oSort(arr)

{

var result ={};

var newArr=[];

for(var i=0;i<arr.length;i++)

{

if(!result[arr])

{

newArr.push(arr)

result[arr]=1

}

}

return newArr

}

Q1:下面参数的值是多少？

"1" + 2 + "3" + 4;

A: 1234

加法优先级等同，从左往右，数字与字符串相加，数字转换成字符串进行运算，结果等同于："12"+"3"+4 = "123"+4 = "1234"。

Q2:下面参数的值是多少？

4 + 3 + 2 + "1"

A:91

优先级同上，从左往右，等同于：7+2+"1" = 9+"1" = "91"。

Q3:下面代码弹出的是什么？

var foo =1;function bar() {

    foo =10;

    return;

    function foo() {}

}

bar();

alert(foo);

A:1

function的定义会提前到当前作用域之前，所以等同于：

var foo =1;

function bar() {

 

    function foo() {}

 

    foo =10;

 

    return;

 

}

 

bar();

 

alert(foo);

所以，在foo=10的时候，foo是有定义的，属于局部变量，影响不到外层的foo

Q4:下面代码弹出的是什么？

function bar() {

 

    return foo;

 

    foo =10;

 

    function foo() {}

 

    var foo =11;

 

}

 

alert(typeof bar());

A:function

与上题类似，等同于：

function bar() {

 

    function foo() {}

 

    return foo;

 

    foo =10;

 

    var foo =11;

 

}

 

alert(typeof bar());

在return之后声明和赋值的foo都无效，所以返回了function。

Q5:下面代码弹出值顺序是什么？

var x =3;

 

 

var foo = {

 

    x:2,

 

    baz: {

 

        x:1,

 

        bar:function() {

 

            return this.x;

 

        }

 

    }

 

}

 

 

var go = foo.baz.bar;

 

 

 

alert(go());

 

alert(foo.baz.bar());

A:3,1

this指向执行时刻的作用域，go的作用域是全局，所以相当于window，取到的就是window.x，也就是var x=3;这里定义的x。而foo.baz.bar()里面，this指向foo.baz，所以取到的是这个上面的x，也就是1。

Q6:下面代码弹出值是什么？

var x =4,

 

    obj = {

 

        x:3,

 

        bar:function() {

 

            var x =2;

 

            setTimeout(function() {

 

                var x =1;

 

                alert(this.x);

 

            },1000);

 

        }

 

    };

 

obj.bar();

A:4

不管有没有这个setTimeout，它里面这个function都是孤立的，this只能是全局的window，即使不延时，改成立即执行结果同样是4。

Q7:下面代码弹出值是什么？

x =1;

function bar() {

 

    this.x =2;

 

    return x;

 

}

var foo =new bar();

 

alert(foo.x);

A:2

这里主要问题是最外面x的定义，试试把x=1改成x={}，结果会不同的。这是为什么呢？在把函数当作构造器使用的时候，如果手动返回了一个值，要看这个值是否简单类型，如果是，等同于不写返回，如果不是简单类型，得到的就是手动返回的值。如果，不手动写返回值，就会默认从原型创建一个对象用于返回

Q8:下面代码弹出值是什么？

function foo(a) {

 

    alert(arguments.length);

 

}

 

foo(1,2,3);

A:3

arguments取的是实参的个数，而foo.length取的是形参个数。

Q9:下面代码弹出值是什么？

var foo =function bar() {};

 

alert(typeof bar);

A:undefined

这种情况下bar的名字从外部不可见，那是不是这个名字别人就没法知道了呢？不是，toString就可以看到它，比如说alert(foo)，可以看看能打出什么。

Q10:下面代码弹出值是什么？

var arr = [];

 

arr[0]  ='a';

 

arr[1]  ='b';

 

arr.foo ='c';

 

alert(arr.length);

A:2

数组的原型是Object，所以可以像其他类型一样附加属性，不影响其固有性质。

Q11:下面代码弹出值是什么？

function foo(a) {

 

    arguments[0] =2;

 

    alert(a);

 

}

 

foo(1);

A:2

实参可以直接从arguments数组中修改。

Q12:下面代码弹出值是什么？

function foo(){}

delete foo.length;

 

alert(typeof foo.length);

A:number

foo.length是无法删除的，它在Function原型上。

js的几种数据类型：number,string,boolean,object,undefined

js的常见内置对象类：

Date,Array,Math、Number、Boolean、String、Array、RegExp、Function...

["1", "2", "3"].map(parseInt)

[typeof null, null instanceof Object]

[ [3,2,1].reduce(Math.pow), [].reduce(Math.pow)] ]

 var val = 'smtg';

 console.log('Value is ' + (val === 'smtg') ? 'Something' : 'Nothing');

1.创建一个对象

      function Person(name, age) {

        this.name = name;

        this.age = age;

        this.sing = function() { alert(this.name) }

      }

2.谈谈This对象的理解。

       this是js的一个关键字，随着函数使用场合不同，this的值会发生变化。但是总有一个原则，那就是this指的是调用函数的那个对象。

this一般情况下：是全局对象Global。 作为方法调用，那么this就是指这个对象

3.事件、IE与火狐的事件机制有什么区别？ 如何阻止冒泡？

       1. 我们在网页中的某个操作（有的操作对应多个事件）。例如：当我们点击一个按钮就会产生一个事件。是可以被 JavaScript 侦测到的行为。  

 2. 事件处理机制：IE是事件冒泡、火狐是 事件捕获；

 3.  ev.stopPropagation();

     4.什么是闭包（closure），为什么要用？

       执行say667()后,say667()闭包内部变量会存在,而闭包内部函数的内部变量不会存在.使得Javascript的垃圾回收机制GC不会收回say667()所占用的资源，因为say667()的内部函数的执行需要依赖say667()中的变量。这是对闭包作用的非常直白的描述.

  function say667() {

    // Local variable that ends up within closure

    var num = 666;

    var sayAlert = function() { alert(num); }

    num++;

    return sayAlert;

}

var sayAlert = say667();

 sayAlert()//执行结果应该弹出的667  

5.如何判断一个对象是否属于某个类？

        使用instanceof （待完善）

 

       if(a instanceof Person){

           alert('yes');

       }

6.new操作符具体干了什么呢?

         1、创建一个空对象，并且 this 变量引用该对象，同时还继承了该函数的原型。

  2、属性和方法被加入到 this 引用的对象中。

  3、新创建的对象由 this 所引用，并且最后隐式的返回 this 。

    var obj  = {};

    obj.__proto__ = Base.prototype;

    Base.call(obj);

7.JSON 的了解

       JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小

{'age':'12', 'name':'back'}

8.js延迟加载的方式有哪些

       defer和async、动态创建DOM方式（用得最多）、按需异步载入js

9.ajax 是什么?ajax 的交互模型?同步和异步的区别?如何解决跨域问题?

  1. 通过异步模式，提升了用户体验2. 优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用  3. Ajax在客户端运行，承担了一部分本来由服务器承担的工作，减少了大用户量下的服务器负载。

  2. Ajax的最大的特点是什么。

  Ajax可以实现动态不刷新（局部刷新）

  readyState属性 状态 有5个可取值： 0=未初始化 ，1=正在加载 2=以加载，3=交互中，4=完成

ajax的缺点

  1、ajax不支持浏览器back按钮。

  2、安全问题 AJAX暴露了与服务器交互的细节。

  3、对搜索引擎的支持比较弱。

  4、破坏了程序的异常机制。

  5、不容易调试。

跨域： jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面

10.模块化怎么做？

 

立即执行函数,不暴露私有成员

var module1 = (function(){

var _count = 0;

var m1 = function(){

//...

};

var m2 = function(){

//...

};

return {

m1 : m1,

m2 : m2

};

})();

11.对Node的优点和缺点提出了自己的看法：

 

    *（优点）因为Node是基于事件驱动和无阻塞的，所以非常适合处理并发请求，因此构建在Node上的代理服务器相比其他技术实现（如Ruby）的服务器表现要好得多。此外，与Node代理服务器交互的客户端代码是由javascript语言编写的，因此客户端和服务器端都用同一种语言编写，这是非常美妙的事情。    *（缺点）Node是一个相对新的开源项目，所以不太稳定，它总是一直在变，

      而且缺少足够多的第三方库支持。看起来，就像是Ruby/Rails当年的样子。

12.异步加载的方式

        (1) defer，只支持IE(2) async：  (3) 创建script，插入到DOM中，加载完毕后callBack

documen.write和 innerHTML的区别

document.write只能重绘整个页面     innerHTML可以重绘页面的一部分

13.告诉我答案是多少？

        function(x){

    delete x;

    alert(x);

})(1+5);

函数参数无法delete删除，delete只能删除通过for in访问的属性。

当然，删除失败也不会报错，所以代码运行会弹出“1”。

14.JS中的call()和apply()方法的区别？

        例子中用 add 来替换 sub，add.call(sub,3,1) == add(3,1) ，所以运行结果为：alert(4);

注意：js 中的函数其实是对象，函数名是对 Function 对象的引用。function add(a,b)

{

    alert(a+b);

}function sub(a,b)

{

    alert(a-b);

}

add.call(sub,3,1);  

15.Jquery与jQuery UI 有啥区别？

    *jQuery是一个js库，主要提供的功能是选择器，属性修改和事件绑定等等。*jQuery UI则是在jQuery的基础上，利用jQuery的扩展性，设计的插件。提供了一些常用的界面元素，诸如对话框、拖动行为、改变大小行为等等

16.jquery 中如何将数组转化为json字符串，然后再转化回来？

jQuery中没有提供这个功能，所以你需要先编写两个jQuery的扩展： $.fn.stringifyArray = function(array) {

        return JSON.stringify(array)

    }

           $.fn.parseArray = function(array) {

        return JSON.parse(array)

    }  然后调用： $("").stringifyArray(array)

17.JavaScript中的作用域与变量声明提升？

HTML+CSS面试题

1.对WEB标准以及W3C的理解与认识

      标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维 护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性；

 

2.xhtml和html有什么区别

     HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言

最主要的不同：XHTML元素必须被正确地嵌套。

              XHTML元素必须被关闭。

              标签名必须用小写字母。

              XHTML文档必须拥有根元素。

 

3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?

     用于声明文档使用那种规范（html/Xhtml）一般为 严格 过度 基于框架的html文档

加入XMl声明可触发，解析方式更改为IE5.5拥有IE5.5的bug

 

4.行内元素有哪些?块级元素有哪些?CSS的盒模型?

      块级元素：div p h1 h2 h3 h4 form ul

      行内元素: a b br i span input select

      Css盒模型:内容，border ,margin，padding

 

5.CSS引入的方式有哪些? link和@import的区别是?

      内联内嵌 外链 导入

      区别：同时加载

      前者无兼容性，后者CSS2.1以下浏览器不支持

      Link支持使用javascript改变样式，后者不可

 

6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?

       标签选择符类选择符 id选择符

      继承不如指定 Id>class>标签选择后者优先级高

 

7.前端页面有哪三层构成，分别是什么?作用是什么?

      结构层 Html表示层 CSS 行为层 js

 

8.css的基本语句构成是?

      选择器{属性1:值1;属性2:值2;……}

 

9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

      Ie(Ie内核)火狐（Gecko） 谷歌（webkit）opear(Presto)

 

10.写出几种IE6 BUG的解决方法

      1.双边距BUG float引起的 使用display

      2.3像素问题 使用float引起的 使用dislpay:inline -3px

      3.超链接hover点击后失效 使用正确的书写顺序 link visited hover active

      4.Ie z-index问题 给父级添加position:relative

      5.Png透明 使用js代码 改

      6.Min-height最小高度 ！Important解决’

      7.select在ie6下遮盖 使用iframe嵌套

      8.为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）

 

11.标签上title与alt属性的区别是什么?

     Alt当图片不显示是 用文字代表。

     Title为该属性提供信息

 

12.描述css reset的作用和用途。

     Reset重置浏览器的css默认属性 浏览器的品种不同，样式不同，然后重置，让他们统一

 

13.解释css sprites，如何使用。

     Css精灵 把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量

 

14.浏览器标准模式和怪异模式之间的区别是什么?

     盒子模型渲染模式的不同

     使用 window.top.document.compatMode可显示为什么模式

 

15.你如何对网站的文件和资源进行优化?期待的解决方案包括：

      文件合并

      文件最小化/文件压缩

      使用CDN托管

      缓存的使用

 

16.什么是语义化的HTML?

      直观的认识标签对于搜索引擎的抓取有好处

 

17.清除浮动的几种方式，各自的优缺点

      1.使用空标签清除浮动clear:both（理论上能清楚任何标签，，，增加无意义的标签）

      2.使用overflow:auto（空标签元素清除浮动而不得不增加无意代码的弊端,,使用zoom:1用于兼容IE）

      3.是用afert伪元素清除浮动(用于非IE浏览器)

JavaScript原型，原型链? 有什么特点？

 

*  原型对象也是普通的对象，是对象一个自带隐式的__proto__ 属性，原型也有可能有自己的原型，如果一个原型对象的原型不为null的话，我们就称之为原型链。

*  原型链是由一些用来继承和共享属性的对象组成的（有限的）对象链。

 

* JavaScript的数据对象有那些属性值？

 

　　writable：这个属性的值是否可以改。

 

configurable：这个属性的配置是否可以删除，修改。

 

enumerable：这个属性是否能在for…in循环中遍历出来或在Object.keys中列举出来。

 

value：属性值。

 

* 当我们需要一个属性的时，Javascript引擎会先看当前对象中是否有这个属性， 如果没有的话，就会查找他的Prototype对象是否有这个属性。

 

 function clone(proto) {

 

function Dummy() { }

 

Dummy.prototype = proto;

 

Dummy.prototype.constructor = Dummy;

 

return new Dummy(); //等价于Object.create(Person);

 

 }

 

        function object(old) {

         function F() {};

         F.prototype = old;

         return new F();

        }

    var newObj = object(oldObject);

12.列出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 属性的值。

13.页面重构怎么操作？

 

编写 CSS、让页面结构更合理化，提升用户体验，实现良好的页面效果和提升性能。

14.语义化的理解？

 

html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；

在没有样式CCS情况下也以一种文档格式显示，并且是容易阅读的。

搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，利于 SEO。

使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。

15.HTML5的离线储存？

localStorage    长期存储数据，浏览器关闭后数据不丢失；

sessionStorage  数据在浏览器关闭后自动删除。

16.为什么要初始化CSS样式。

因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。

 

当然，初始化样式会对SEO有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。

 

*最简单的初始化方法就是：* {padding: 0; margin: 0;} （不建议）

 

    淘宝的样式初始化：

    body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }

    body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; }

    h1, h2, h3, h4, h5, h6{ font-size:100%; }

    address, cite, dfn, em, var { font-style:normal; }

    code, kbd, pre, samp { font-family:couriernew, courier, monospace; }

    small{ font-size:12px; }

    ul, ol { list-style:none; }

    a { text-decoration:none; }

    a:hover { text-decoration:underline; }

    sup { vertical-align:text-top; }

    sub{ vertical-align:text-bottom; }

    legend { color:#000; }

    fieldset, img { border:0; }

    button, input, select, textarea { font-size:100%; }

    table { border-collapse:collapse; border-spacing:0; }

17.(写)描述一段语义的html代码吧。

 

    （HTML5中新增加的很多标签（如：<article>、<nav>、<header>和<footer>等）

     就是基于语义化设计原则）  

 

        < div id="header">

        < h1>标题< /h1>

        < h2>专注Web前端技术< /h2>

        < /div>

语义 HTML具有以下特性：

 

文字包裹在元素中，用以反映内容。例如：

段落包含在 <p>元素中。

顺序表包含在<ol>元素中。

从其他来源引用的大型文字块包含在<blockquote>元素中。

HTML 元素不能用作语义用途以外的其他目的。例如：

<h1>包含标题，但并非用于放大文本。

<blockquote>包含大段引述，但并非用于文本缩进。

空白段落元素 ( <p></p> )并非用于跳行。

文本并不直接包含任何样式信息。例如：

不使用 <font>或 <center> 等格式标记。

类或 ID 中不引用颜色或位置。

18.absolute的containing block计算方式跟正常流有什么不同？

 

19.position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样？

 

20.对BFC规范的理解？（W3C CSS 2.1规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关 系和相互作用。）

 

21.iframe有那些缺点？

 

    *iframe会阻塞主页面的Onload事件；

 

    *iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。

    使用iframe之前需要考虑这两个缺点。如果需要使用iframe，最好是通过javascript

    动态给iframe添加src属性值，这样可以可以绕开以上两个问题。

22.css定义的权重

 

以下是权重的规则：标签的权重为1，class的权重为10，id的权重为100，以下例子是演示各种定义的权重值：

 

/*权重为1*/

div{

}

/*权重为10*/

.class1{

}

/*权重为100*/

#id1{

}

/*权重为100+1=101*/

#id1 div{

}

/*权重为10+1=11*/

.class1 div{

}

/*权重为10+10+1=21*/

.class1 .class2 div{

}

 

如果权重相同，则最后定义的样式会起作用，但是应该避免这种情况出现

23.eval是做什么的？

 

它的功能是把对应的字符串解析成JS代码并运行；

避免使用eval，不安全，非常耗性能（2次，一次解析成js语句，一次执行）。

23.写一个通用的事件侦听器函数

 

`// event(事件)工具集，来源：https://github.com/markyun

markyun.Event = {

    // 页面加载完成后

    readyEvent : function(fn) {

        if (fn==null) {

            fn=document;

        }

        var oldonload = window.onload;

        if (typeof window.onload != 'function') {

            window.onload = fn;

        } else {

            window.onload = function() {

                oldonload();

                fn();

            };

        }

    },

    // 视能力分别使用dom0||dom2||IE方式 来绑定事件

    // 参数： 操作的元素,事件名称,事件处理程序

    addEvent : function(element, type, handler) {

        if (element.addEventListener) {

            //事件类型、需要执行的函数、是否捕捉

            element.addEventListener(type, handler, false);

        } else if (element.attachEvent) {

            element.attachEvent('on' + type, function() {

                handler.call(element);

            });

        } else {

            element['on' + type] = handler;

        }

    },

    // 移除事件

    removeEvent : function(element, type, handler) {

        if (element.removeEnentListener) {

            element.removeEnentListener(type, handler, false);

        } else if (element.datachEvent) {

            element.detachEvent('on' + type, handler);

        } else {

            element['on' + type] = null;

        }

    },

    // 阻止事件 (主要是事件冒泡，因为IE不支持事件捕获)

    stopPropagation : function(ev) {

        if (ev.stopPropagation) {

            ev.stopPropagation();

        } else {

            ev.cancelBubble = true;

        }

    },

    // 取消事件的默认行为

    preventDefault : function(event) {

        if (event.preventDefault) {

            event.preventDefault();

        } else {

            event.returnValue = false;

        }

    },

    // 获取事件目标

    getTarget : function(event) {

        return event.target || event.srcElement;

    },

    // 获取event对象的引用，取到事件的所有信息，确保随时能使用event；

    getEvent : function(e) {

        var ev = e || window.event;

        if (!ev) {

            var c = this.getEvent.caller;

            while (c) {

                ev = c.arguments[0];

                if (ev && Event == ev.constructor) {

                    break;

                }

                c = c.caller;

            }

        }

        return ev;

    }

};

24.99%的网站都需要被重构是那本书上写的？

 

* 网站重构：应用web标准进行设计（第2版）

25.什么叫优雅降级和渐进增强？

 

优雅降级：Web站点在所有新式浏览器中都能正常工作，如果用户使用的是老式浏览器，则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题，针对不同版本的IE的hack实践过优雅降级了,为那些无法支持功能的浏览器增加候选方案，使之在旧式浏览器上以某种形式降级体验却不至于完全失效.

 

渐进增强：从被所有浏览器支持的基本功能开始，逐步地添加那些只有新式浏览器才支持的功能,向页面增加无害于基础浏览器的额外样式和功能的。当浏览器支持时，它们会自动地呈现出来并发挥作用。

26.Node.js的适用场景

 

高并发、聊天、实时消息推送

27.WEB应用从服务器主动推送Data到客户端有那些方式？

 

    html5 websoket

    WebSocket通过Flash

    XHR长时间连接

    XHR Multipart Streaming

    不可见的Iframe

<script>标签的长时间连接(可跨域)

JavaScript原型，原型链? 有什么特点？

 

*  原型对象也是普通的对象，是对象一个自带隐式的__proto__ 属性，原型也有可能有自己的原型，如果一个原型对象的原型不为null的话，我们就称之为原型链。

*  原型链是由一些用来继承和共享属性的对象组成的（有限的）对象链。

 

* JavaScript的数据对象有那些属性值？

 

writable：这个属性的值是否可以改。

 

configurable：这个属性的配置是否可以删除，修改。

 

enumerable：这个属性是否能在for…in循环中遍历出来或在Object.keys中列举出来。

 

value：属性值。

 

* 当我们需要一个属性的时，Javascript引擎会先看当前对象中是否有这个属性， 如果没有的话，就会查找他的Prototype对象是否有这个属性。

 

 function clone(proto) {

 

function Dummy() { }

 

Dummy.prototype = proto;

 

Dummy.prototype.constructor = Dummy;

 

return new Dummy(); //等价于Object.create(Person);

 

 }

 

        function object(old) {

         function F() {};

         F.prototype = old;

         return new F();

        }

    var newObj = object(oldObject);

}