jQuery 库包含以下功能: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改 AJAX Utilities 提示...click() click() 方法是当按钮点击事件被触发时会调用一个函数。 该函数在用户点击 HTML 元素时执行。...在下面的实例中,当点击事件在某个 元素上触发时,隐藏当前的 元素: ("p").click(function(){ jQuery hide() 和 show() 设置隐藏时间 1000...它可以取以下值:"slow"、"fast" 或毫秒。 可选的 callback 参数是动画完成后所执行的函数名称。 下面的例子演示 animate() 方法的简单应用。...eq 1 jquery filter 什么是 AJAX?
什么是事件? 页面对不同访问者的响应叫做事件。 事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。 实例: 在元素上移动鼠标。...选取单选按钮 点击元素 在事件中经常使用术语”触发”(或”激发”)例如: “当您按下按键时触发 keypress 事件”。...页面中指定一个点击事件:$(“p”).click(); 下一步是定义什么时间触发事件。...该事件方法在 jQuery 语法 章节中已经提到过。 click() click() 方法是当按钮点击事件被触发时会调用一个函数。 该函数在用户点击 HTML 元素时执行。...; } ); focus() 当元素获得焦点时,发生 focus 事件。 当通过鼠标点击选中元素或通过 tab 键定位到元素时,该元素就会获得焦点。
).ready(function) |将函数绑定到文档的就绪事件(当文档完成加载时) | |$(selector).click(function) |触发或将函数绑定到被选元素的点击事件 | |...|触发、或将函数绑定到指定元素的 change 事件 | |click() |触发、或将函数绑定到指定元素的 click 事件 | |dblclick() |触发...| |ready() |文档就绪事件(当 HTML 文档就绪可用时) | |resize() |触发、或将函数绑定到指定元素的 resize 事件 | |scroll...|触发、或将函数绑定到指定元素的 submit 事件 | |toggle() |绑定两个或多个事件处理器函数,当发生轮流的 click 事件时执行。...AJAX AJAX AJAX = 异步JavaScript + XML 在不重载网页的情况下,后台加载数据并显示在页面上 AJAX菜鸟教程 jQuery ajax()方法 AJAX
实时事件 实时事件为,如果先前将所有a元素绑定了一个事件,接着在创建一个新的a的节点,如果此时触发事件,则新创建的a元素不会被触发事件,因为绑定的不是实时的事件。...> { $('span').fadeIn(100); }); return false; }) 当发生click事件的时候,会先回调click内的事件,发生动画,在等待3000秒的时候,继续回调下一个函数...hide的时候,会在完成的时候调用,如果动画使用show,将会在完成时,调用show 动画选项对象 缓动函数,jquery中有默认的缓动函数,为正弦函数,即swing,还有一个线性的缓动函数为linear...请求成功,或未成功,将会调用该函数 Ajax工具函数 jQuery.getScript() 将会异步的加载一段脚本 同样受到同源的限制 第一个参数为url,第二个参数为运行完成以后将要执行的回调函数 jQuery.getScript...过滤或者预处理服务器返回的数据 ajax事件 ajax还会在请求的时候,触发相应的事件 这个用于在请求某些图片的时候,在图片仍旧继续下载的时候,使用相应的时间,提示出图片正在加载中 例如 $('#loading_animation
1 jQuery快速入门 1.1 什么是jQuery 它是一个开源的JavaScript类库 。...分类 方法 说明 表单事件 blur([[data],function]) 当元素失去焦点时触发 表单事件 focus([[data],function]) 当元素获得焦点时触发 表单事件 change...resize([[data], function]) 当调整浏览器窗口的大小时会被触发 参数function表示触发事件时执行的处理程序(函数)。...() 通过序列化表单值,创建对象数组(名称和值) Ajax事件 ajaxComplete(fn) Ajax请求完成时触发的事件执行函数 Ajax事件 ajaxError(fn) Ajax请求发生错误时触发的事件执行函数...Ajax事件 ajaxSend(fn) Ajax请求发送前触发的事件执行函数 Ajax事件 ajaxStart(fn) Ajax请求开始时触发的事件执行函数 Ajax事件 ajaxStop(fn) Ajax
这是一个Ajax事件 当所有AJAX请求都停止时,隐藏loading信息。...这是一个Ajax事件 当AJAX请求成功完成时,显示信息。...show(speed, [callback]) 以优雅的动画显示所有匹配的元素,并在显示完成后可选地触发一个回调函数。 hide() 隐藏所有的匹配元素。...hide(speed, [callback]) 以优雅的动画隐藏所有匹配的元素,并在显示完成后可选地触发一个回调函数 toggle() 切换元素的可见状态。...与$(fn)等价 (3)toggle(evenFn, oddFn): 每次点击时切换要调用的函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。
.ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxError() 当 Ajax 请求完成且出现错误时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxStart() 当首个 Ajax 请求完成开始时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxStop() 当所有 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxSuccess() 当 Ajax 请求成功完成时显示一条消息。 jQuery.get() 使用 HTTP GET 请求从服务器加载数据。
jQuery库包含以下功能: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改 AJAX Utilities jQuery...什么是事件? 页面对不同访问者的响应叫做事件。 事件处理程序指的是当 HTML中发生某些事件时所调用的方法。 实例: 在元素上移动鼠标。...选取单选按钮 点击元素 在事件中经常使用术语"触发"(或"激发")例如:"当您按下按键时触发 keypress 事件"。 ?...页面对不同访问者的响应叫做事件。 事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。 实例: 在元素上移动鼠标。...页面中指定一个点击事件: $("p").click(); 下一步是定义什么时间触发事件。您可以通过一个事件函数实现: $("p").click(function(){// 动作触发后执行的代码!!
这是一个Ajax事件 当所有AJAX请求都停止时,隐藏loading信息。...这是一个Ajax事件 当AJAX请求成功完成时,显示信息。...show( speed, [callback] ) 以优雅的动画显示所有匹配的元素,并在显示完成后可选地触发一个回调函数。 hide( ) 隐藏所有的匹配元素。...fadeIn( speed, [callback] ) 通过不透明度的变化来实现所有匹配元素的淡入效果,并在动画完成后可选地触发一个回调函数。...fadeOut( speed, [callback] ) 通过不透明度的变化来实现所有匹配元素的淡出效果,并在动画完成后可选地触发一个回调函数。
,它有以下功能: HTML元素选取 HTML元素操作 CSS操作 HTML事件函数 JavaScript特效和动画 HTML DOM遍历和修改 AJAX Utilities(实用工具) 很多大公司都在使用...事件处理程序:当HTML中发生某些事件调用的方法。...(提交表单时),change(元素值(适用于表单字段)发生改变时),focus(元素获得焦点),blur(元素失去焦点)事件; 文档/窗口事件:load(元素已加载触发,在jQuery1.8中废除。...ajax中也有load()方法),resize(调整浏览器窗口大小时触发),scroll(滚动指定的元素),unload(jQuery1.8中废弃)事件。 另: hover():模拟光标悬停事件。...默认false:仅停止当前活动动画,允许插入的动画向后执行; 可选的goToEnd:是否立即完成当前动画。默认false。 因而,默认的stop()会清除当前元素上的动画。
函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求。 .ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxError() 当 Ajax 请求完成且出现错误时注册要调用的处理程序。这是一个 Ajax 事件。 .ajaxSend() 在 Ajax 请求发送之前显示一条消息。...jQuery.ajaxSetup() 设置将来的 Ajax 请求的默认值。 .ajaxStart() 当首个 Ajax 请求完成开始时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxStop() 当所有 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。 .ajaxSuccess() 当 Ajax 请求成功完成时显示一条消息。...设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 。
1.2 库与框架的区别 1.3 jQuery对象与dom对象的区别 1.4 立即表达式与工厂模式 1.5 无冲突处理机制 第二章:核心机制(完成) 2.1 理解上下文this 2.1.1 作为对象方法调用...2.1.2 作为函数调用 2.1.3 作为apply 或 call 调用 2.1.4 作为构造函数 2.2 原型的优与弊 2.3 架构设计 2.3.1 new操作符...13.12.3 jQuery自定义事件原理 13.13 trigger的几种常见用法 13.13.1 常用模拟 13.13.2 触发自定义事件 13.13.3...13.15.4 jQuery.event 事件机制 focusin/ focusout 事件 13.15.5 为什么用捕获?...实现一个简单的动画设计 15.5 jQuery动画的引擎 15.6 jQuery动画队列 15.7 基于队列动画调用 15.8 动画的底层实现类 15.8.1 基于deferred的设计
$(window).keydown() //当键盘或按钮被按下时触发事件 $(window).keypress() //当键盘或按钮被按下时触发事件,每输入一个字符都触发一次 $("input").keyup...() //当按钮被松开时触发事件 $(window).scroll() //当用户滚动时触发事件 $(window).resize() //当调整浏览器窗口的大小时触发事件 $("input[type=...'text']").change() //当节点的值发生改变时触发事件 $("input").select() //当input 节点中的文本被选择时触发事件 $("form").submit() //...success 当请求之后调用。传入返回后的数据,以及包含成功代码的字符串。 complete 当请求完成之后调用这个函数,无论成功或失败。...设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。
动画 通过animate方法可以设置元素某属性值上的动画,可以设置一个或多个属性值,动画执行完成后会执行一个函数。...,还可以设置为‘linear’,匀速运动 参数四:动画回调函数,动画完成后执行的匿名函数 */ $('#div1').animate({ width:300, height:...() DOM加载完成 submit() 用户递交表单 表单验证 1、什么是正则表达式: 能让计算机读懂的字符串匹配规则。...@#$%^&*]{6,20}$/; //手机号码验证: var rePhone = /^1[34578]\d{9}$/; 事件冒泡 什么是事件冒泡 在一个对象上触发某类事件(比如单击onclick...'键对应的值,然后将这个值和json数据拼装成一个函数调用的形式的字符串返回,就完成了一个jsonp的接口,这个键值对是由$.ajax函数自动产生的。
jquery是一种快速,小巧,功能丰富的JavaScript库,可以让html文档遍历和操作,事件处理,动画和ajax更加容易使用的一种api,可以在多种浏览器中工作。...封装了JavaScript常用的功能代码,提供了一种简便的JavaScript设计模式,优化了HTML文档操作,事件处理,动画设计和ajax交互。...click([[data],fn]) 触发每一个匹配的click事件,这个函数会调用执行绑定到click事件的所有函数。...,fn: 在动画完成执行的函数,每个元素执行一次 // 显示段落 html代码: hello jquery代码 $("p").show() jquery...AJAX 函数 什么是 AJAX?
使⽤JQuery可以轻松地选择和操作HTML元素,从⽽减少了开发⼈员编写的代码量,提⾼了开发效率, 它提供的 API 易于使⽤且兼容众多浏览器,这让诸如 HTML ⽂档遍历和操作、事件处理、动画和 Ajax...JQuery对于事件的处理也进⾏了简化, 提供了⼀个简单的API来绑定、触发和处理事件,使开发⼈员能够更⽅便地处理各种交互⾏为....- 详细解释与示例 focus(): 当元素获得焦点时触发,常用于输入框的交互。...; }); // 用户提交表单时,弹出提示 change(): 当表单元素的值发生变化时触发,适用于下拉菜单或单选按钮等。...alert("动画完成"); }); // 此代码将使 #elementId 渐渐变透明,同时向右移动50px,并在5秒内切换高度 ajax(): 用于进行异步HTTP请求,可以加载数据而无需重新加载页面
核心:DOM操作 属性操作 文档处理 CSS操作 动画效果 jQuery 核心:事件处理 jQuery 核心:Ajax jQuery 辅助工具方法 遍历方法 DOM元素和jQuery...对象的相互转换 jQuery 核心:扩展jQuery对象的属性和方法 jQuery入门 什么是jQuery 在使用jQuery之前,我们必须先了解什么是jQuery,它能够干什么(不然我们为啥要用它...,第一次触发后就自动解除绑定 以上方法均可重复调用,从而为指定的click事件绑定多个处理函数。...触发click事件时,将按照绑定顺序依次执行每个处理函数。...jQuery还支持手动触发指定的事件。
//方式2 获取元素的索引值可以使用 index() 方法 1.3 jquery 动画 通过 animate 方法可以设置元素某属性值上的动画,动画执行完后会执行一个函数。...动画曲线,默认为‘swing’,缓冲运动,还可以设置为‘linear’,匀速运动 参数四:动画回调函数,动画完成后执行的匿名函数 */ 2.进阶 2.1 特殊效果 1. fadeIn() 淡入...@#$%^&*]{6,20}$/; //手机号码验证: var rePhone = /^1[34578]\d{9}$/; 3.高级 3.1 事件冒泡 先来看看什么是事件冒泡: 在一个对象上触发某类事件...那么它有什么作用呢? 答:事件冒泡允许多个操作被集中处理(把事件处理器添加到一个父级元素上,避免把事件处理器添加到多个子级元素上),它还可以让你在对象层的不同级别捕获事件。...这是什么意思呢?
7.css3动画如何在动作结束时保持状态不变 使用animation-fill-mode,值为none,表示不改变默认行为;值为forwards,当动画完成后,保持最后一个属性值;backwards,在...一些数组或对象的方法经常能使用到,jQuery将其保存为局部变量以提高访问速度。jQuery实现的链式调用可以节约代码,所返回的都是同一个对象,可以提高开发效率。...get()方法只是ajax()方法中get请求的简化方法 60.要是在一个jQuery事件处理程序里返回了false会怎么样 这将会阻止事件向上冒泡以及默认行为。...比如控制CSS动画播放和停止 input的focus事件会触发锚点定位,我们可以利用label当触发器实现选项卡切换效果 84.用css创建一个三角形,并简述原理 width: 0; height:...触发重排的条件:任何页面布局和几何属性的改变都会触发重排 比如: 1、页面渲染初始化(无法避免) 2、添加或删除可见的DOM元素; 3、元素位置的改变,或者使用动画; 4、元素尺寸的改变——大小,外边距
JQuery 提供了四类函数 (1). DOM 操作 — 重点 (2). 事件处理 (3). 动画函数 (4). AJAX 5. JQuery 的版本问题 (1)....', fn),可以先后绑定多次,只要“DOM 内容(只包括 html/js)加载完成”即可触发 28....JQuery 中的 trigger()函数 使用 JS 代码代替用户触发指定的事件,调用之前绑定的监听函数 ('.btn').trigger( 'click' ) 可简写:('.btn').click...} 调用方式:$('li').max() JQuery(..)或 $(..)的返回值是一个类数组对象—“JQuery 对象”,所有的 JQuery 对象的原型:JQuery.fn; 若想给所有的 JQuery...fn beforeSend:fn //响应完成并且成功调用fn success:fn //响应完成但有问题调用fn error:fn //