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 事件的旅程①事件捕获：事件首先会交给最外层的元素，接着再交给更具体的元素。