0

0

jQuery入门须知总结

php中世界最好的语言

php中世界最好的语言

发布时间:2018-04-23 15:13:59

|

1036人浏览过

|

来源于php中文网

原创

这次给大家带来jquery入门须知总结,jquery入门须知的注意事项有哪些,下面就是实战案例,一起来看一下。

jQuery 对象

•jQuery 对象就是通过 jQuery 包装 DOM 对象后产生的对象。

•jQuery 对象是 jQuery 独有的。

•只有 jQuery 对象才能使用 jQuery 的方法,在 jQuery 对象中无法使用 DOM 对象的任何方法,反之 DOM 对象也无法使用任何 jQuery 的方法。

•约定:如果获取的是 jQuery 对象,那么要在变量前面加上 $

•jQuery 对象中封装了多个 DOM 对象,同时 jQuery 对象是类数组对象

•数组与类数组对象的区别

1.数组的类型是Array

2.类数组对象的类型是 Object

DOM 对象转 jQuery 对象

•使用 $()将 DOM 对象包装起来,就可以转换成 jQuery 对象

var item = document.getElementsByTagName('ul')[0], // DOM对象
  $item = $(item); // jQuery对象

jQuery 对象转换为 DOM 对象

jQuery 对象通过 jQuery 提供的 get(index)方法,得到对应的 DOM 对象

var $ul = $('ul'),
  ul = $ul.get(0);

jQuery 对象是一个类数组对象,可以通过 [] 方式,得到对应的 DOM 对象。

类数组对象

类数组对象本质就是一个对象,只不过存储方式类似于数组的结构

•arguments 对象 ---- 接受函数实参的个数
•jQuery 对象 ---- 底层就是 dom 对象

属性

•length 属性(数组的长度 | 元素的个数)

方法

•get(index):根据 index 放回对应的 dom 对象
•eq(index):根据 index 返回对应的 jQuery 对象
•index():查找元素的索引值

ready 和 onlaod 的区别

ready

1.具有简写方式
2.在一个 HTML 页面中允许出现多个
3.加载完 DOM 结构就执行
4.执行速度快

onload

1.没有简写方式
2.在一个 HTML 页面中只能使用一个
3.需要等页面所有资源加载完才执行
4.执行速度比 ready 慢

jQuery 动画

基本隐藏、显示效果

•show()/ hide()

$('p').show(1000).hide(1000);

若是对同一个 jQuery 对象使用,可以采用链式操作。

滑动式动画效果

•slideDown()/ slideUp()

$('p').slideUp(1000).slideDown(1000);

淡入淡出

•fadeIn()淡入
•fadeOut()淡出

$('p').fadeIn(1000).fadeOut(1000);

并发和排队效果

•并发效果:设置多个动画同时执行
•排队效果:设置多个动画,按照先后顺序依次执行

jQuery 插件

jQuery 插件的作用

•扩展 jQuery 的功能
•呈现组件化特点

日期插件 - layDate插件

•layDate初步使用
1.引入 laydate.js
2.laydate(options)

开发插件

全局函数

全局函数,实际上就是 jQuery 本身的方法。

jQuery 内置的一些功能是通过全局函数实现的。

•比如$.ajax()就是典型的全局函数

向 jQuery 命名空间添加一个函数,只需要将这个新函数指定为 jQuery 本身的一个属性

$.globalFunction = function(){
  // todo...
};

可以通过 jQuery.globalFunction()或者 $.globalFunction()来调用

当需要添加多个函数可以使用$.extend()函数

$.extend({
  functionOne: function(){
    // todo...
  },
  functionTwo: function(){
    // todo...
  }
});

通过上述代码可以添加全局函数,但是代码存在有关命名空间的风险

我们可以把属于一个插件的所有全局函数封装到一个对象

$.plugins = function(){
  functionOne: function(){
    // todo...
  },
  functionTwo: function(){
    // todo...
  }
};

通过上述代码,其实是为全局函数创建了另一个方法 --- plugins

functionOne 和 functionTwo 已经成为 plugins 对象的属性。

$.plugins.functionOne();
$.plugins.functionTwo();

添加 jQuery 实例对象的方法

$.fn.method = function(){};对象方法的环境

在任何插件方法内部,关键字 this 引用的都是当前调用方法的 jQuery对象,因此可以在 this 上面调用任何内置的 jQuery 方法。

方法连缀

通过 return this 来实现链式操作

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

jquery上传表单样式

青辰印刷综合业务管理系统(含网站WEB程序)2.0
青辰印刷综合业务管理系统(含网站WEB程序)2.0

易学易用:友好的系统操作界面,无须具备专业知识,即可熟练的使用系统。功能完善:具备新建、修改、明细、审批、导入、导出、删除、批量、打印等功能。模型开发:自定义表单字段选项零代码二次开发,可无限扩展后台功能模块。 维护方便:基于互联网技术B/S体系结构,实施快速,极大的减少系统升级维护工作。售后保证:专业的技术研发团队,可提供可靠的产品迭代、版本升级和技术支持服务。超低成本:一次投入终身使用、用户不

下载

jQuery解析xml文件详解

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
C# ASP.NET Core微服务架构与API网关实践
C# ASP.NET Core微服务架构与API网关实践

本专题围绕 C# 在现代后端架构中的微服务实践展开,系统讲解基于 ASP.NET Core 构建可扩展服务体系的核心方法。内容涵盖服务拆分策略、RESTful API 设计、服务间通信、API 网关统一入口管理以及服务治理机制。通过真实项目案例,帮助开发者掌握构建高可用微服务系统的关键技术,提高系统的可扩展性与维护效率。

16

2026.03.11

Go高并发任务调度与Goroutine池化实践
Go高并发任务调度与Goroutine池化实践

本专题围绕 Go 语言在高并发任务处理场景中的实践展开,系统讲解 Goroutine 调度模型、Channel 通信机制以及并发控制策略。内容包括任务队列设计、Goroutine 池化管理、资源限制控制以及并发任务的性能优化方法。通过实际案例演示,帮助开发者构建稳定高效的 Go 并发任务处理系统,提高系统在高负载环境下的处理能力与稳定性。

23

2026.03.10

Kotlin Android模块化架构与组件化开发实践
Kotlin Android模块化架构与组件化开发实践

本专题围绕 Kotlin 在 Android 应用开发中的架构实践展开,重点讲解模块化设计与组件化开发的实现思路。内容包括项目模块拆分策略、公共组件封装、依赖管理优化、路由通信机制以及大型项目的工程化管理方法。通过真实项目案例分析,帮助开发者构建结构清晰、易扩展且维护成本低的 Android 应用架构体系,提升团队协作效率与项目迭代速度。

75

2026.03.09

JavaScript浏览器渲染机制与前端性能优化实践
JavaScript浏览器渲染机制与前端性能优化实践

本专题围绕 JavaScript 在浏览器中的执行与渲染机制展开,系统讲解 DOM 构建、CSSOM 解析、重排与重绘原理,以及关键渲染路径优化方法。内容涵盖事件循环机制、异步任务调度、资源加载优化、代码拆分与懒加载等性能优化策略。通过真实前端项目案例,帮助开发者理解浏览器底层工作原理,并掌握提升网页加载速度与交互体验的实用技巧。

95

2026.03.06

Rust内存安全机制与所有权模型深度实践
Rust内存安全机制与所有权模型深度实践

本专题围绕 Rust 语言核心特性展开,深入讲解所有权机制、借用规则、生命周期管理以及智能指针等关键概念。通过系统级开发案例,分析内存安全保障原理与零成本抽象优势,并结合并发场景讲解 Send 与 Sync 特性实现机制。帮助开发者真正理解 Rust 的设计哲学,掌握在高性能与安全性并重场景中的工程实践能力。

218

2026.03.05

PHP高性能API设计与Laravel服务架构实践
PHP高性能API设计与Laravel服务架构实践

本专题围绕 PHP 在现代 Web 后端开发中的高性能实践展开,重点讲解基于 Laravel 框架构建可扩展 API 服务的核心方法。内容涵盖路由与中间件机制、服务容器与依赖注入、接口版本管理、缓存策略设计以及队列异步处理方案。同时结合高并发场景,深入分析性能瓶颈定位与优化思路,帮助开发者构建稳定、高效、易维护的 PHP 后端服务体系。

420

2026.03.04

AI安装教程大全
AI安装教程大全

2026最全AI工具安装教程专题:包含各版本AI绘图、AI视频、智能办公软件的本地化部署手册。全篇零基础友好,附带最新模型下载地址、一键安装脚本及常见报错修复方案。每日更新,收藏这一篇就够了,让AI安装不再报错!

168

2026.03.04

Swift iOS架构设计与MVVM模式实战
Swift iOS架构设计与MVVM模式实战

本专题聚焦 Swift 在 iOS 应用架构设计中的实践,系统讲解 MVVM 模式的核心思想、数据绑定机制、模块拆分策略以及组件化开发方法。内容涵盖网络层封装、状态管理、依赖注入与性能优化技巧。通过完整项目案例,帮助开发者构建结构清晰、可维护性强的 iOS 应用架构体系。

222

2026.03.03

C++高性能网络编程与Reactor模型实践
C++高性能网络编程与Reactor模型实践

本专题围绕 C++ 在高性能网络服务开发中的应用展开,深入讲解 Socket 编程、多路复用机制、Reactor 模型设计原理以及线程池协作策略。内容涵盖 epoll 实现机制、内存管理优化、连接管理策略与高并发场景下的性能调优方法。通过构建高并发网络服务器实战案例,帮助开发者掌握 C++ 在底层系统与网络通信领域的核心技术。

33

2026.03.03

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
jQuery 教程
jQuery 教程

共42课时 | 7.3万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 12.4万人学习

tp6+adminlte搭建通用后台
tp6+adminlte搭建通用后台

共39课时 | 5.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号