面试题之JavaScript+Jquery

问题：body中的onload()函数和jQuery中的document.ready()有什么区别？
回答：onload()和document.ready()的区别有以下两点：
1、我们可以在页面中使用多个document.ready()，但只能使用一次onload()。
2、document.ready()函数在页面DOM元素加载完以后就会被调用，而onload()函数则要在所有的关联资源（包括图像、音频）加载完毕后才会调用。

Jquery选择器：
大概归纳为9种。
(1)基本：

id

element
.class
*
(2)层次选择器：
ancestor descendant
parent > child
prev + next
prev ~ siblings()选取每个匹配元素的所有同辈元素(不包括自己) nextAll(): 选取每个匹配元素之后的所有同辈元素。
(3)基本过滤器选择器
:first
:last
:not
:even
:odd
:eq
:gt
:lt
:header
:animated
(4)内容过滤器选择器
:contains
:empty
:has
:parent
(5)可见性过滤器选择器
:hidden
:visible
(6)属性过滤器选择器
[attribute]
[attribute=value]
[attribute!=value]
[attribute^=value]
[attribute$=value]
[attribute*=value]
[attrSel1][attrSel2][attrSelN]
(7)子元素过滤器选择器
:nth-child
:first-child
:last-child
:only-child
(8)表单选择器
:input
:text
:password
:radio
:checkbox
:submit
:image
:reset
:button
:file
:hidden
(9)表单过滤器选择器
:enabled
:disabled
:checked
:selected

问题：jQuery中的Delegate()函数有什么作用？
回答：delegate()会在以下两个情况下使用到：
1、如果你有一个父元素，需要给其下的子元素添加事件，这时你可以使用delegate()了，代码如下：
$(“ul”).delegate(“li”, “click”, function(){$(this).hide();
});
2、当元素在当前页面中不可用时，可以使用delegate()

问题：怎样用jQuery编码和解码URL？
回答：在jQuery中，我们可以使用以下方法实现URL的编码和解码。
encodeURIComponent(url) and decodeURIComponent(url)

问题：如何用jQuery禁用浏览器的前进后退按钮？
回答：实现代码如下：

$(document).ready(function() { window.history.forward(1); window.history.forward(-1); });

jQuery绑定事件的四种方式：
jQuery中提供了四种事件监听方式，分别是bind、live、delegate、on，对应的解除监听的函数分别是unbind、die、undelegate、off。
1、bind用法：
$(‘#myol li’).bind(‘click’,getHtml); bind的特点就是会把监听器绑定到目标元素上，有一个绑一个，在页面上的元素不会动态添加的时候使用它没什么问题。但如果列表中动态增加一个“列表元素5”，点击它是没有反应的，必须再bind一次才行。 2、live()用法：$(‘#myol li’).live(‘click’,getHtml);
live将监听器绑定到document上，事件的处理需要等待层层冒泡，一直到根节点，才开始执行。优于根节点的子节太多，易导致混乱。已弃用。
3、delegate()用法
$(‘#myol’).delegate(‘li’,’click’,getHtml); 参数多了一个selector，用来指定触发事件的目标元素，监听器将被绑定在调用此方法的元素上。 4、on()的用法$(‘#myol li’).on(‘click’,getHtml);
on与delegate差不多但还是有细微的差别，首先type与selector换位置了，其次selector变为了可选项。

注意：因为其他方法都是内部调用on来完成的，直接使用on可以提高效率，而且你完全可以用on来代替其他三种写法。

1、JavaScript基础数据类型
JavaScript数据类型包括原始类型和引用类型，原始类型有五个:
Number（数值） String（字符串） Boolean（布尔） Null（空） Undefined（未定义）
引用类型有一个：
Object（对象）
通过typeof(x)可以返回一个变量x的数据类型“number”、“string”、“boolean”、“undefined”、”object”，这里要注意一点：typeof运算符对于null类型返回的是object

2 谈一谈JavaScript作用域链
当执行一段JavaScript代码（全局代码或函数）时，JavaScript引擎会创建为其创建一个作用域又称为执行上下文（Execution Context），在页面加载后会首先创建一个全局的作用域，然后每执行一个函数，会建立一个对应的作用域，从而形成了一条作用域链。每个作用域都有一条对应的作用域链，链头是全局作用域，链尾是当前函数作用域。
作用域链的作用是用于解析标识符，当函数被创建时（不是执行），会将this、arguments、命名参数和该函数中的所有局部变量添加到该当前作用域中，当JavaScript需要查找变量X的时候（这个过程称为变量解析），它首先会从作用域链中的链尾也就是当前作用域进行查找是否有X属性，如果没有找到就顺着作用域链继续查找，直到查找到链头，也就是全局作用域链，仍未找到该变量的话，就认为这段代码的作用域链上不存在x变量，并抛出一个引用错误（ReferenceError）的异常。

6 new构建对象的本质
function User(){
this.name = “Vicfeel”;
this.age = 23;
}
var user = new User();
通过new操作符，实际上在构造函数User中完成了如下操作：
创建一个新的对象，这个对象的类型是object；
设置这个新的对象的内部、可访问性和prototype属性为构造函数（指prototype.construtor所指向的构造函数）中设置的；
执行构造函数；
返回新创建的对象。
function User(){
//this = {};
//this.constructor = User；
this.name = “Vicfeel”;
this.age = 23;
//return this;
}
var user = new User();
如果构造函数默认返回的新创建的this对象，如果手动return 一个变量的话，如果该变量是原始类型则无效，如果是对象，则返回该对象。

2.javascript是面向对象的，怎么体现javascript的继承关系？
使用prototype来实现。

4.form中的input可以设置为readonly和disable，请问2者有什么区别？
readonly不可编辑，但可以选择和复制；值可以传递到后台
disabled不能编辑，不能复制，不能选择；值不可以传递到后台

5.js中的3种弹出式消息提醒（警告窗口，确认窗口，信息输入窗口）的命令式什么？
alert
confirm
prompt

7.javaScript的2种变量范围有什么不同？
全局变量：当前页面内有效
局部变量：方法内有效

8、innerHTML，innerText，outerHTML，innerText的区别？
1）、innerHTML与outerHTML在设置对象的内容时包含的HTML会被解析，而innerText与outerText则不会。
2)、在设置时，innerHTML与innerText仅设置标签内的文本，而outerHTML与outerText设置包括标签在内的文本。
特别说明：
　　innerHTML是符合W3C标准的属性，而innerText、outerText、outerHTML只适用于IE浏览器，因此，尽可能地去使用innerHTML，而少用innerText，如果要输出不含HTML标签的内容，可以使用innerHTML取得包含HTML标签的内容后，再用正则表达式去除HTML标签，

神马是 NaN，它的类型是神马？怎么测试一个值是否等于 NaN?
NaN 是 Not a Number 的缩写，Javascript 的一种特殊数值，其类型是 Number，可以通过 isNaN(param) 来判断一个值是否是 NaN：
console.log(isNaN(NaN)); //true
console.log(isNaN(23)); //false
console.log(isNaN(‘ds’)); //true
console.log(isNaN(‘32131sdasd’)); //true
console.log(NaN === NaN); //false
console.log(NaN === undefined); //false
console.log(undefined === undefined); //false
console.log(typeof NaN); //number
console.log(Object.prototype.toString.call(NaN)); //[object Number]

isNaN() 成为了 Number 的静态方法：Number.isNaN().

js中几种实用的跨域方法原理详解
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信，比如用ajax向一个不同的域请求数据，或者通过js获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同，都被当作是不同的域。
一、通过jsonp跨域
在js中，我们直接用XMLHttpRequest请求不同域上的数据时，是不可以的。但是，在页面上引入不同域上的js脚本文件却是可以的，jsonp正是利用这个特性来实现的。
这样jsonp的原理就很清楚了，通过script标签引入一个js文件，这个js文件载入成功后会执行我们在url参数中指定的函数，并且会把我们需要的json数据作为参数传入。所以jsonp是需要服务器端的页面进行相应的配合的。

2、通过修改document.domain来跨子域
浏览器都有一个同源策略，其限制之一就是第一种方法中我们说的不能通过ajax的方法去请求不同源中的文档。 它的第二个限制是浏览器中不同域的框架之间是不能进行js的交互操作的。有一点需要说明，不同的框架之间（父子或同辈），是能够获取到彼此的window对象的，但蛋疼的是你却不能使用获取到的window对象的属性和方法(html5中的postMessage方法是一个例外，还有些浏览器比如ie6也可以使用top、parent等少数几个属性)，总之，你可以当做是只能获取到一个几乎无用的window对象。

3、使用window.name来进行跨域
window对象有个name属性，该属性有个特征：即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的，每个页面对window.name都有读写的权限，window.name是持久存在一个窗口载入过的所有页面中的，并不会因新页面的载入而进行重置。

4、使用HTML5中新引进的window.postMessage方法来跨域传送数据
window.postMessage(message,targetOrigin) 方法是html5新引进的特性，可以使用它来向其它的window对象发送消息，无论这个window对象是属于同源或不同源，目前IE8+、FireFox、Chrome、Opera等浏览器都已经支持window.postMessage方法。
调用postMessage方法的window对象是指要接收消息的那一个window对象，该方法的第一个参数message为要发送的消息，类型只能为字符串；第二个参数targetOrigin用来限定接收消息的那个window对象所在的域，如果不想限定域，可以使用通配符 * 。
需要接收消息的window对象，可是通过监听自身的message事件来获取传过来的消息，消息内容储存在该事件对象的data属性中。
上面所说的向其他window对象发送消息，其实就是指一个页面有几个框架的那种情况，因为每一个框架都有一个window对象。