jQuery 访谈问题（jQuery Interview Questions）

jQuery是一个快速而简洁的JavaScript库，由John Resig在2006年创建，有一个很好的座右铭 - 写得少，做得更多。 jQuery简化了HTML文档遍历，事件处理，动画和Ajax交互，以实现快速Web开发。 jQuery是一个JavaScript工具包，旨在通过编写更少的代码来简化各种任务。

以下是jQuery支持的重要核心功能列表 -

• DOM manipulation - 通过使用名为Sizzle的跨浏览器开源选择器引擎，jQuery可以轻松选择DOM元素，遍历它们并修改其内容。

• Event handling - jQuery提供了一种捕获各种事件的优雅方式，例如用户单击链接，而不需要使用事件处理程序来混淆HTML代码本身。

• AJAX Support - jQuery可以帮助您使用AJAX技术开发响应迅速且功能丰富的站点。

• Animations - jQuery带有大量内置动画效果，您可以在您的网站中使用它们。

• Lightweight - jQuery是非常轻量级的库 - 大小约为19KB（Minified和gzipped）。

• Cross Browser Support - jQuery具有跨浏览器支持，适用于IE 6.0 +，FF 2.0 +，Safari 3.0 +，Chrome和Opera 9.0+。

• Latest Technology - jQuery支持CSS3选择器和基本XPath语法。

使用$（document）.ready（）函数。 在加载DOM之后和加载页面内容之前，其中的所有内容都将加载。

JavaScript非常支持Object概念。 您可以使用对象文字创建对象，如下所示 -

var emp = {
   name: "Zara",
   age: 10
};

您可以使用点表示法编写和读取对象的属性，如下所示 -

// Getting object properties
emp.name  // ==> Zara
emp.age   // ==> 10
// Setting object properties
emp.name = "Daisy"  // <== Daisy
emp.age  =  20      // <== 20

您可以使用数组文字定义数组，如下所示 -

var x = [];
var y = [1, 2, 3, 4, 5];

数组具有可用于迭代的length属性。 我们可以读取数组的元素如下 -

var x = [1, 2, 3, 4, 5];
for (var i = 0; i < x.length; i++) {
   // Do something with x[i]
}

命名函数在定义时具有名称。 可以使用function关键字定义命名函数，如下所示 -

function named(){
   // do some stuff here
}

JavaScript中的函数可以是命名的，也可以是匿名的。

匿名函数可以与普通函数类似的方式定义，但它没有任何名称。

是! 可以将匿名函数分配给变量。

是! 匿名函数可以作为参数传递给另一个函数。

JavaScript变量参数表示传递给函数的参数。

使用typeof运算符，我们可以获得传递给函数的参数类型。 例如 -

function func(x){
   console.log(typeof x, arguments.length);
}
func();                //==> "undefined", 0
func(1);               //==> "number", 1
func("1", "2", "3");   //==> "string", 3

使用arguments.length属性，我们可以获得传递给函数的参数总数。 例如 -

function func(x){
   console.log(typeof x, arguments.length);
}
func();                //==> "undefined", 0
func(1);               //==> "number", 1
func("1", "2", "3");   //==> "string", 3

arguments对象有一个callee属性，它指的是你所在的函数。 例如 -

function func() {
   return arguments.callee; 
}
func();                // ==> func

JavaScript着名的关键字总是指当前的上下文。

变量的范围是程序中定义它的区域。 JavaScript变量只有两个范围。

• Global Variables - 全局变量具有全局范围，这意味着它在JavaScript代码中的任何位置都可见。

• Local Variables - 局部变量仅在定义它的函数中可见。 函数参数始终是该函数的本地参数。

局部变量优先于具有相同名称的全局变量。

回调是一个普通的JavaScript函数，作为参数或选项传递给某个方法。 一些回调只是事件，被调用以使用户有机会在触发某个状态时做出反应。

只要从某个内部作用域内访问在当前作用域之外定义的变量，就会创建闭包。

下面的示例显示了变量计数器如何在创建，增量和打印功能中可见，但不在其外部 -

function create() {
   var counter = 0;
   return {
      increment: function() {
         counter++;
      },
      print: function() {
         console.log(counter);
      }
   }
}
var c = create();
c.increment();
c.print();     // ==> 1

charAt（）方法返回指定索引处的字符。

concat（）方法返回指定索引处的字符。

forEach（）方法为数组中的每个元素调用一个函数。

indexOf（）方法返回第一次出现的指定值的调用String对象内的索引，如果未找到则返回-1。

length（）方法返回字符串的长度。

pop（）方法从数组中删除最后一个元素并返回该元素。

push（）方法将一个或多个元素添加到数组的末尾，并返回数组的新长度。

reverse（）方法反转数组元素的顺序 - 第一个成为最后一个，最后一个成为第一个。

sort（）方法对数组的元素进行排序。

substr（）方法通过指定的字符数返回从指定位置开始的字符串中的字符。

toLowerCase（）方法返回转换为小写的调用字符串值。

toUpperCase（）方法返回转换为大写的调用字符串值。

toString（）方法返回数字值的字符串表示形式。

jQuery Selector是一个函数，它使用表达式根据给定的条件从DOM中找出匹配的元素。 简单地说，选择器用于使用jQuery选择一个或多个HTML元素。 一旦选择了元素，我们就可以对所选元素执行各种操作。 jQuery选择器以美元符号和括号 - $（）开头。

工厂函数$（）是jQuery（）函数的同义词。 因此，如果你使用任何其他JavaScript库，其中$ sign与其他东西冲突，那么你可以用jQuery名称替换$ sign，你可以使用函数jQuery（）而不是$（）。

$（'tag-name'）选择文档中tag-name类型的所有元素。 例如，$（'p'）选择文档中的所有段落

。

$（'＃some-id'）选择文档中具有some-id ID的单个元素。

$（'。some-class'）选择文档中具有某类类的所有元素。

$（'*'）选择DOM中可用的所有元素。

$（'E，F，G'）选择所有指定选择器E，F或G的组合结果，其中选择器可以是任何有效的jQuery选择器。

attr（）方法可用于从匹配集中的第一个元素获取属性的值。

attr（name，value）方法可用于使用传递的值将命名属性设置为包装集中的所有元素。

addClass（classes）方法可用于将定义的样式表应用于所有匹配的元素。 您可以指定由空格分隔的多个类。

removeAttr（name）方法可用于从每个匹配的元素中删除属性。

如果指定的类至少存在于一组匹配的元素中，则hasClass（class）方法返回true。

removeClass（class）方法从匹配元素集中删除所有或指定的类。

如果指定的类不存在，则toggleClass（class）方法添加指定的类，如果存在，则删除指定的类。

html（）方法获取第一个匹配元素的html内容（innerHTML）。

html（val）方法设置每个匹配元素的html内容。

text（）方法获取所有匹配元素的组合文本内容。

text（val）设置所有匹配元素的文本内容。

val（）方法获取第一个匹配元素的输入值。

如果在《input》上调用它，则val（val）方法设置每个匹配元素的value属性，但如果在上使用传递的值调用它，则会选择传递选项（如果调用它）复选框或单选框，然后将检查所有匹配的复选框和radiobox。

filter（selector）方法可用于过滤掉与指定选择器不匹配的匹配元素集中的所有元素。 可以使用任何选择器语法编写选择器。

eq（index）方法将匹配元素集合减少为单个元素。

is（selector）方法根据表达式检查当前选择，如果选择的至少一个元素适合给定的选择器，则返回true。

not（selector）方法从匹配元素集中删除与指定选择器匹配的元素。

切片（选择器）方法选择匹配元素的子集。

add（selector）方法将由给定选择器匹配的更多元素添加到匹配元素集。

andSelf（）方法将先前的选择添加到当前选择。

children（[selector]）方法获取一组元素，其中包含每个匹配元素集的所有唯一直接子元素。

最接近的（selector）方法获取一组元素，这些元素包含与指定选择器匹配的最接近的父元素，包括起始元素。

如果元素是iframe，则contents（）方法查找匹配元素（包括文本节点）内的所有子节点，或内容文档。

end（）方法恢复最近的“破坏性”操作，将匹配元素集更改为先前的状态。

find（selector）方法搜索与指定选择器匹配的后代元素。

下一个（[selector]）获取一组元素，这些元素包含每个给定元素集的唯一下一个兄弟。

nextAll（[selector]）查找当前元素之后的所有兄弟元素。

offsetParent（）方法返回一个jQuery集合，其中包含第一个匹配元素的定位父元素。

父（[selector]）方法获取元素的直接父级。 如果在一组元素上调用，则parent返回一组唯一的直接父元素。

parents（[selector]）方法获取一组元素，这些元素包含匹配元素集的唯一祖先（根元素除外）。

prev（[selector]）方法获取一组元素，其中包含每个匹配元素集的唯一先前兄弟节点。

prevAll（[selector]）方法查找当前元素前面的所有兄弟元素。

兄弟姐妹（[selector]）方法获取一组元素，其中包含每个匹配元素集的所有唯一同胞。

css（name）方法返回第一个匹配元素的样式属性。

css（name，value）方法将单个样式属性设置为所有匹配元素的值。

height（val）方法设置每个匹配元素的CSS高度。

height（）方法获取第一个匹配元素的当前计算值，像素和高度。

innerHeight（）方法获取第一个匹配元素的内部高度（不包括边框并包括填充）。

innerWidth（）方法获取第一个匹配元素的内部宽度（不包括边框并包括填充）。

offset（）方法获取第一个匹配元素相对于文档的当前偏移量（以像素为单位）。

offsetParent（）方法返回一个jQuery集合，其中包含第一个匹配元素的定位父元素。

outerHeight（[margin]）方法获取第一个匹配元素的外部高度（默认包括边框和填充）。

outerWidth（[margin]）方法获取第一个匹配元素的外部宽度（默认包括边框和填充）。

position（）方法获取元素相对于其偏移父元素的顶部和左侧位置。

width（val）方法设置每个匹配元素的CSS宽度。

width（）方法获取第一个匹配元素的当前计算值，像素和宽度。

empty（）方法从匹配元素集中删除所有子节点。

remove（expr）方法从DOM中删除所有匹配的元素。

Event对象的preventDefault（）方法阻止浏览器执行默认操作。

Event对象的isDefaultPrevented（）方法返回是否曾在此事件对象上调用event.preventDefault（）。

Event对象的stopPropagation（）方法停止将事件冒泡到父元素，从而阻止任何父处理程序被通知事件。

Event对象的isPropagationStopped（）方法返回是否曾在此事件对象上调用event.stopPropagation（）。

Event对象的stopImmediatePropagation（）方法停止执行其余的处理程序。

Event对象的isImmediatePropagationStopped（）方法返回是否曾在此事件对象上调用event.stopImmediatePropagation（）。

bind（type，[data]，fn）函数将处理程序绑定到每个匹配元素的一个或多个事件（如click）。 也可以绑定自定义事件。

ready（fn）函数绑定要在DOM准备好遍历和操作时执行的函数。

load（url，[data]，[callback]）方法从远程文件加载HTML并将其注入DOM。

ajaxComplete（callback）方法可用于注册每当AJAX请求完成时要执行的回调。