当前位置:文档之家› jQuery基础教程第四版 第3章学习笔记

jQuery基础教程第四版 第3章学习笔记

本文由我司收集整编,推荐下载,如有疑问,请与我司联系
jQuery 基础教程第四版第3 章学习笔记
2017/08/30 114 第3 章 3.1 在页面加载后执行任务 3.1.1 代码执行的时机选择①当文档完全下载到浏览器中时,会触发window.onload 事件,意味着页面上的全部元素对于JavaScript 而言都是可以操作的。

②通过(document).ready()注册的事件处理程序,则会在DOM 完全就绪并可以使用时调用。

意味着所有元素对
脚本而言都是可以访问的,但是,却不意味着所有关联的文件都已经下载完毕。

3.1.2 基于一个页面执行多个脚本①.onload 属性一次只能保存对一个函数的引用,因此不能在现有的基础上再增加新行为。

②每次调用(document).ready()方法时都会向内部的行为队列添加一个新函数,当页面加载完成后,所有的函数都会被执行。

而且,这些函数会按照注册他们的顺序依次执行。

3.1.3 .ready()的简写形式①(document).ready()结构,实际上是基于document 这个DOM 元素构建而成的jQuery 对象上调用了.ready()方法。

②(document).ready(){ //这里是代码……}); 可以简写成:$(function() { //这里是代码……} 3.1.4 向.ready()回调函数中传入参数
3.2 处理简单的事件 3.2.1 简单的样式转换器①在用户单击按钮时执行,需要引入.on()方法。

通过这个方法,可以指定任何DOM 事件,并为该事件添加一
种行为。

此时,事件是click。

eg: (‘#switcher- large’).on(‘click’,function(){});3.2.2 启用其他按钮3.2.3 利用事件处理程序的上下
文①当触发任何事件处理程序时,关键字this 引用的都是携带相应行为的DOM 元素。

通过在事件处理程序中使用(this),可以为相应的元素创建jQuery 对象,然后就如同使用CSS 选择符找到该元素一样对它进行操作。

3.2.4 使用事件上下文进一步减少代码上下文关键字this 引用的是DOM 元素,而不是jQuery 对象,因此可以使用原生的DOM 属性来确定被单击元素的ID。

3.2.5 简写的事件 3.2.6 显示和隐藏高级特性jQuery 的toggleClass()方法,能够根据相应的类是否存在而添加或删除类。

3.3 事件传播 3.3.1 事件的旅程①事件捕获:事件首先会交给最外层的元素,接着再交给更具体的元素。

相关主题