jQuery Interview Questions函数详解

首页 / jQuery入门教程 / jQuery Interview Questions函数详解

尊敬的读者,这些 jQuery面试问题是专门设计的,目的是让您熟悉在您采访 jQuery 时可能遇到的问题的性质。根据我的经验,优秀的面试官几乎不会计划在面试过程中提出任何特定的问题,通常,问题是从该主题的一些基本概念开始的,然后根据进一步的讨论和您的回答继续进行讨论-

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

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

  • DOM操作-jQuery通过使用称为Sizzle的跨浏览器开源selector引擎,使DOM元素的选择,遍历和修改其内容变得容易。

  • 事件处理-jQuery提供了一种优雅的方式来捕获各种各样的事件,如用户单击链接,而无需将HTML代码本身与事件混在一起处理程序。

  • AJAX支持-jQuery帮助您使用AJAX技术开发响应迅速且功能丰富的网站。

  • 动画-jQuery带有许多内置的动画效果,您可以在网站中使用它们。

  • 轻量级-jQuery是一个非常轻量级的库-大小约为19KB(压缩并压缩)。

  • 跨浏览器支持-jQuery具有跨浏览器支持,并且在IE 6.0 +,FF 2.0 +,Safari 3.0 +,Chrome和Opera 9.0+中运行良好。

  • 最新技术-jQuery支持CSS3selector和基本XPath语法。

使用$(document).ready()函数。 DOM加载后以及页面内容加载之前,其中的所有内容都将加载。

JavaScript非常支持对象概念。您可以使用对象文字来创建对象,如下所示:

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];

数组的长度属性对于迭代很有用。我们可以如下读取数组的元素-

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著名关键字始终引用当前context。

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

  • 全局变量-全局变量具有全局范围,这意味着它在JavaScript代码中的任何地方都可见。

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

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

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

每当从某个内部范围内访问在当前范围之外定义的变量时,都会创建闭包。

无涯教程网

以下Example显示了变量计数器在创建,增量和打印函数中如何可见,但在函数外部却不可见-

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中找出匹配的元素。简单地说,selector用于使用jQuery选择一个或多个HTML元素。一旦选择了元素,我们就可以对该选定的元素执行各种操作。 jQueryselector以美元符号和括号-$()开头。

工厂函数$()是jQuery()函数的同义词。因此,如果您正在使用其他任何JavaScript库,其中$符号与其他事物冲突,则可以用jQuery名称替换$符号,并且可以使用函数jQuery()代替$()。

$('tag-name') selects all element of type tag-name in the document. For example, $('p') selects all paragraphs <p> in the document.

$('#some-id')选择文档中ID为some-id的单个元素。

$('。some-class')选择文档中所有具有某类类别的元素。

$('*')选择DOM中所有可用的元素。

$('E,F,G')选择所有指定selectorE,F或G的组合输出,其中selector可以是任何有效的jQueryselector。

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()方法获取第一个匹配元素的输入值。

The val(val) method sets the value attribute of every matched element if it is called on <input> but if it is called on <select> with the passed <option> value then passed option would be selected, if it is called on check box or radio box then all the matching check box and radiobox would be checked.

filter(selector)方法可用于从匹配的元素集中滤除与指定selector不匹配的所有元素。可以使用任何selector语法编写selector。

eq(index)方法将匹配元素的集合简化为单个元素。

如果选择的至少一个元素适合给定的selector,则is(selector)方法将根据表达式检查当前选择并返回true。

not(selector)方法从匹配的元素集中删除与指定selector匹配的元素。

slice(selector)方法选择匹配元素的子集。

add(selector)方法将由给定selector匹配的更多元素添加到匹配的元素集中。

andSelf()方法将先前的选择添加到当前选择中。

children([selector])方法获取一组元素,其中包含每个匹配元素集的所有唯一直属子元素。

最近的(selector)方法获取一组元素,这些元素包含与指定selector(包括起始元素)匹配的最接近的父元素。

如果元素是iframe,则content()方法将查找匹配的元素(包括文本节点)或内容文档中的所有子节点。

end()方法还原最近的"破坏性"操作,将匹配元素的集合更改为以前的状态。

find(selector)方法搜索与指定selector匹配的后代元素。

next([selector])获取一组元素,其中包含给定元素集的每个元素的唯一下一个同级。

nextAll([selector])查找当前元素之后的所有同级元素。

offsetParent()方法返回一个jQuery集合,该集合具有第一个匹配元素的父元素。

parent([selector])方法获取元素的直接父级。如果在一组元素上调用,parent返回一组唯一的直接父元素。

Parents([selector])方法获取一组元素,其中包含匹配的元素集的唯一祖先(根元素除外)。

prev([selector])方法获取一组元素,其中包含每个匹配元素集的唯一先前同级。

prevAll([selector])方法查找当前元素前面的所有同级元素。

siblings([selector])方法获取一组元素,其中包含每个匹配元素集的所有唯一同胞。

css(name)方法在第一个匹配的元素上返回样式属性。

css(name,value)方法将单个样式属性设置为所有匹配元素上的值。

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

height()方法获取第一个匹配元素的当前计算像素高度。

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

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

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

offsetParent()方法返回一个jQuery集合,该集合具有第一个匹配元素的父元素。

outsideHeight([margin])方法获取第一个匹配元素的外部高度(默认情况下包括边框和填充)。

outsideWidth([margin])方法获取第一个匹配元素的外部宽度(默认情况下包括边框和填充)。

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

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

width()方法获取当前计算的第一个匹配元素的像素宽度。

empty()方法从匹配的元素集中删除所有子节点。

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

Event对象的preventDefault()方法可防止浏览器执行默认操作。

链接:https://www.learnfk.comhttps://www.learnfk.com/jquery/jquery-interview-questions.html

来源:LearnFk无涯教程网

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。

AJAX请求完成时,可以使用ajaxComplete(callback)方法来注册要执行的回调。

下一步是什么 ?

此外,您可以浏览过去完成的与该主题相关的作业,并确保您能够自信地对它们发表讲话。如果您是新手,那么面试官不会期望您会回答非常复杂的问题,而是必须使您的基本概念非常扎实。

第二,如果您不能回答几个问题,那实际上并不重要,但是无论您回答了什么,您都必须自信地回答,这很重要。因此,在面试中要感到自信。我们在learnfk上祝您好运,有一位优秀的面试官,并祝您未来事业一切顺利。欢呼声:-)

祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)

技术教程推荐

深入拆解Java虚拟机 -〔郑雨迪〕

深入浅出计算机组成原理 -〔徐文浩〕

黄勇的OKR实战笔记 -〔黄勇〕

深度学习推荐系统实战 -〔王喆〕

手把手带你写一个Web框架 -〔叶剑峰〕

反爬虫兵法演绎20讲 -〔DS Hunter〕

林外 · 专利写作第一课 -〔林外〕

深入浅出可观测性 -〔翁一磊〕

AI大模型系统实战 -〔Tyler〕

好记忆不如烂笔头。留下您的足迹吧 :)