Web 前端开发技术（HTML5+CSS3+JavaScript+jQuery） 课件 项目十一　 jQuery 操作方法及应用.pptx

jQuery操作方法及应用Web前端开发技术篇4：jQuery技术

本项目介绍jQuery操作元素对象信息、事件概述、操作文档结构、特效的方法及应用。通过学习jQuery的相关知识和实际操作,引导学生理解理论知识并运用于实践,领会理论与实践相结合的思想。党的二十大报告提出“坚持学思用贯通、知信行统一”。学生要在学原文、知原义、悟原理上下功夫、见实效,做到知其言更知其义、知其然更知其所以然,围绕党的二十大提出的一系列具有开创性、标志性的重要思想、重要观点、重大战略、重大举措,找准和抓实学思用贯通、知信行统一的着力点。序言

目录CONTENTS元素对象信息事件概述操作文档结构0102030405jQuery特效方法链接

01元素对象信息Learningisaveryhappyopportunity,anopportunitythatmustbethoroughlyutilizedinordertoacquireknowledgeandbroadenoneshorizon.

获取元素对象信息获取元素对象信息包括获取元素的文本内容、HTML标记内容、表单值、属性值、样式值等。获取元素对象信息的方法及说明如表11-1所示。元素对象信息

获取元素对象信息获取元素对象信息包括获取元素的文本内容、HTML标记内容、表单值、属性值、样式值等。获取元素对象信息的方法及说明如表11-1所示。元素对象信息

设置元素对象信息设置元素对象信息包括设置元素的文本内容、HTML标记内容、属性值、样式值等。设置元素对象信息的方法及说明如表11-2所示。元素对象信息

设置元素对象信息用css()方法设置元素的属性时,可以批量设置,即对选择的元素对象同时进行多个属性设置。批量设置属性的基本语法格式如下。$(元素).css({属性:属性值,属性:属性值……});其中,属性名称不需要加双引号,属性值要加双引号。另外,属性名称中不能有“-”,还要改为“驼峰标记法”格式,即第一个单词小写,后面单词的首字母大写。例如,CSS中背景颜色属性“background-color”要改为“backgroundColor”。元素对象信息

02事件概述Learningisaveryhappyopportunity,anopportunitythatmustbethoroughlyutilizedinordertoacquireknowledgeandbroadenoneshorizon.

事件概述事件是一些可以通过脚本响应的页面动作。当用户按下鼠标键或提交一个表单,或者在页面上移动鼠标指针时,都会产生相关的事件。事件处理是一段JavaScript代码,总是与页面中的特定部分以及一定的事件相关联。当与页面特定部分关联的事件发生时,事件处理器就会被调用。绝大多数事件的命名是描述性的,很容易理解,如Click、Submit、MouseOver等,通过名称即可猜测其含义。但也有少数事件的名称不易理解,如blur(英文的字面意思为“模糊”),表示一个域或者一个表单失去焦点。通常,事件处理器的命名原则是,在事件名称前加上前缀on。例如,对于click事件,处理器名为onClick。事件概述

事件概述jQuery事件的基本语法格式如下。$(元素).事件名称(function(){事件处理代码;});在jQuery事件中,选中的元素对象触发了事件,如果事件代码中需要对这些元素对象进行处理,则可以再次选中这些元素对象,也可以用this关键字引用当前选中的元素对象。事件概述

键盘事件键盘事件是对文档对象document或对获得焦点的指定元素,设置在按下或释放键盘按键时触发的处理过程。常用的键盘事件及说明如表11-3所示。事件概述

件采购汇总表事件概述鼠标事件鼠标事件是为网页文档中的任意HTML元素对象设置在鼠标操作时触发的处理过程。常用的鼠标事件及说明如表11-4所示。

表单事件表单事件是表单元素发生用户交互动作时触发的事件。常用的表单事件及说明如表11-5所示。事件概述

03操作文档结构Learningisaveryhappyopportunity,anopportunitythatmustbethoroughlyutilizedinordertoacquireknowledgeandbroadenoneshorizon.

操作文档结构jQuery可以在网页文档中添加、删除元素和内容。操作文档结构的常用方法及说明如表11-6所示。操