面试中jQuery常遇到的问题
开始来学习JQuery相关方面的知识,在学习JQuery之前,我首先通过一些途径,弄明白了以下问题,这也是面试中常常问到的一些问题。所以整理了下。
1、什么是JQuery?
jQuery是JavaScript的类库,它由JohnResig(美国人)创建,至今已经吸引了来自世界各地的众多JavaScript高手加入该团队。
2、什么是类库?
这个和Java、.NET中的类库意思相似,但是在JQuery中,只是集合了许多方法的功能集合,使我们可以通过简单的代码就能实现复杂的效果
3、JQuery与JavaScript的关系?
JQuery是使用JavaScript编写的,也就是说JavaScript可以任意调用,其他程序并不能轻易的调用
4、JavaScript、jQuery、Ajax、Json等又是什么?区别又是什么?
这里只解释Ajax和Json,Ajax全称为“Asynchronous JavaScript and
XML”(异步JavaScript和XML),它是由JavaScript+CSS+DOM+
XMLHttpRequest的四种技术的结合,并且JS是Ajax的核心。jQuery将Ajax的实现变得更加轻松容易。Ajax就是咱们常说的局部刷新。JSON(JavaScript
Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写的同时也易于机器解析和生成。它基于JavaScript的一个子集。
Json采用完全独立于语言的文本格式,可以简单的理解为数据存储的一种格式或交换方式。
5、JQuery可以做什么?
1>获取页面的部分内容:
a)
不使用js库,必须写很多行代码来遍历dom树,并定位html文档的指定部分,而jquery提供了一个强大而有效的选择机制来返回被检查或者被操作的文档
2> 修改页面的外观
a)
Css提供了一个影响文档渲染的强大方法,当web浏览器不支持同样的标准时,它却是不尽人意的,Jquery能弥补这些差距,提供了跨所有浏览器的同样的标准的支持
b) 另外即时页面被渲染后,Jquery仍可改变文档中一部分中的类或者独立的样式属性
3> 修改页面的内容
a)
不仅限于外观的改变,Jquery还可以用很少的按键就可修改文档的内容本身。文本可改变,图像可插入或替换,列表可重新排序或者整个HTML结构可被重写和扩展,完成这些只需一套非常易用的API函数
4>在页面中响应用户的交互
a) 例如,用户单击链接,我们不需要将事件句柄混杂到HTML代码中,同时事件句柄API删除浏览器不一致性,往往会让web开发者感到很烦恼
5>给页面加上动画
6>无刷新返回服务器端的信息
7>简化共同的js任务:提供了改进基本的js结构,如迭代和数组等
6、第一个JQuery程序,当页面显示时,弹出Hello word的对话框。
在写JQuery程序之前,我们首先来写一个js的函数,如下
然后在body的onload事件中调用该函数,当页面加载时,立即弹出对话框,并显示内容Hello word。
那么用JQuery来实现的话,首先需要将JQuery的库也就是JQuery.js这个文件给导入
下面开始来编写我们的第一JQuery程序,实现和上面同样的效果
在这个demo中我们应该知道$等同于jQuery,$(document).ready()等同于jQuery(document).ready();
首先我解释一下jQuery jQuery有一个用来作为DOM快速载入javascript的得心应手的小函数,那就是ready…
它在页面加载完成之前执行。 (也许window.onload()能实现同样的功能,但当window.onload函数执行的时候,
要说明所有东西已经载入,包括图像和横幅等等。要知道较大的图片下载速度会比较慢,因此用户必须等待大图
下载完毕才能看到window.onload()执行的代码效果,这样就花费了很长的等待时间,这不是我们想要的。
$(document).ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度。
简单地说,这个方法纯粹是对向window.load事件注册事件的替代方法。
通过使用这个方法,可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数
. $(document).ready(function(){ // 你的代码 });
$(document)意思是说,获取整个网页文档对象(类似的于window.document),
$(document).ready意思就是说,获取文档对象就绪的时候。 上
面这段代码的意思是检查文档对象直到它能够允许被操作
(这样做比window.onload()函数要快的多,因为只要文档对象载入完成就能够执行代码了,
而不需要等待页面中的图片下载是否已经完成)---这是我们想要的。