jQuery入门一（jQuery下载以及基本语法）
1. jQuery简介
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。详情请查看百度百科
简单来说，jQuery就是简化了JS中繁琐的DOM操作，使你的代码更简洁，真正做到“write Less，Do More”
2. 下载以及引用
- 下载
jQuery的推荐去官网下载 jQuery下载地址
如下图所示：
两个链接对应的文件
| 编号 | 1 | 2 |
|---|---|---|
| 文件名 | jQuery.3.4.1.min.js | jQuery.3.4.1.js |
| 版本 | 发布版（压缩版） | 开发版（常规版） |
| 适用场景 | 项目上线时用 | 平时开发用 |
| 区别 | 删除了所有的空格和回车，代码非常紧凑，可读性变差，但是文件大小缩减了，页面的访问速度加快了 | 规范的代码，可读性高 |
两个文件内容都是一模一样的，只是文件大小不同
- 引用
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
</head>
<body>
</body>
</html>
直接引入外部文件就行了，文件路径信息不要写错，jQuery的下载以及引用就结束了。
3. 基本语法与初始函数
- 基本语法
$(选择器).方法名（）;
jQuery中选择器语法可以参考CSS，因为它们非常相似。
核心函数$()：获取页面中元素转化为jQuery对象
选择器 ：获取需要操作的DOM元素
方法名 ()：jQuery中提供的方法，其中包括绑定事件处理的方法
$符号代表jQuery，所以
$(function(){}) 等价于
jQuery(function({})
两种写法都是合法的，意思都一样，$是简写的一种形式
- 初始函数
| windows.onload() | $(document).ready() | |
|---|---|---|
| 执行时机 | 必须等待页面中所有的内容加载完毕后（图片、flash、视频等）才能执行 | 网页中所有的DOM文档结构绘制完毕后立即执行，可能与DOM元素关联的内容（图片、flash、视频）并没有加载完。 |
| 编写个数 | 同一页面不能编写多个 | 同一页面可以编写多个 |
| 简化写法 | 无 | $(function(){}) |
- DOM模型
将HTML XML等文档结构的标签语言看成DOM模型
DOM模型下即是DOM节点
DOM节点有三种类型：
- 元素节点：例如
<html> <div> <body>...所有的元素 - 属性节点：元素节点的属性 例如
title src alt... - 文本节点：文本节点
- DOM对象
以上三种节点类型的具体对象 就是DOM对象。
使用层面：凡是JavaScript能够直接操作的对象，就是DOM对象。
例如 ：var title = document.getElementById("myTitle");
通过js获取到的title对象，就是一个DOM对象
- jQuery对象
凡是jQuery能够直接操作的对象，就是jQuery对象。
为了容易区别DOM对象和jQuery对象，一般都会在jQuery对象名称前加$号
例如：var $title = $("#myTitle");
通过jQuery对象获取到的 $title 就是一个jQuery对象。同样一个元素，既可以成为一个DOM对象（JavaScript对象），也可以成为一个jQuery对象。
注意：DOM对象只适用于js的各种语法（函数、属性），jQuery对象只用于jQuery的各种语法（函数、属性）。
DOM对象与jQuery对象互相独立。
例如：
title是DOM对象，因此可以使用js属性或方法 title.innerHTML
$title是jQuery对象，因此可以使用jQuery属性或方法 $title.html()
jQuery入门一（jQuery下载以及基本语法）的更多相关文章
- jQuery入门、jQuery选择器、jQuery操作
一.什么是jQuery及如何使用 1.1 jQuery 简介 jQuery是一个兼容多浏览器的javascript函数库(把我们常用的一些功能进行了封装,方便我们来调用,提高我们的开发效率.),核心理 ...
- jquery 入门之-------jquery 简介
什么是jquery? Jquery是一个Javascript库,通过封装原生的Javascript函数得到一套定义好的方法.它可以用个少的代码完成更多更强大更复杂的功能,从而得到开发者的青睐. So! ...
- JQuery入门
JQuery入门 1 jQuery的概述 1.1 jQuery简介 jQuery是一个 JavaScript函数库,它是一个“写的更少,但做的更多”的轻量级 JavaScript 库.jQuery 极 ...
- JQuery入门篇
JQuery入门篇 jQuery选择器 “$”表示JQuery对象 根据ID查找 $(‘#var’)表示将一个id值为var的DOM节点封装成一个jQuery对象,DOM节点必须以“#”开头. 例如: ...
- jQuery入门（4）jQuery中的Ajax应用
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- 第一百六十二节，jQuery入门介绍
jQuery入门 学习要点: 1.什么是 jQuery 2.学习 jQuery的条件 3.jQuery的版本 4.jQuery的功能和优势 5.其他 JavaScript库 6.是否兼容低版本 I ...
- jQuery入门和DOM对象
jQuery入门和DOM对象 1.开发准备 1. 下载的版本: jquery-3.3.1.min.js :压缩版,发布版84.8KB jquery-3.3.1.js :常规版,开发版265KB 2. ...
- jQuery入门（1）jQuery中万能的选择器
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- 第 1 章 jQuery 入门
学习要点: 1.什么是 jQuery 2.学习 jQuery 的条件 3.jQuery 的版本 4.jQuery 的功能和优势 5.其他 JavaScript 库 6.是否兼容低版本 IE 7.下载及 ...
随机推荐
- C语言实现常用排序算法——基数排序
#include<stdio.h> #include<math.h> #define SIZE 10 #define C_SIZE 20 /*行数稳定=10,切记!列数务必搞的 ...
- Protoc Buffer 优化传输大小的一个细节
Protoc Buffer 是我们比较常用的序列化框架,Protocol Buffer 序列化后的占空间小,传输高效,可以在不同编程语言以及平台之间传输.今天这篇文章主要介绍 Protocol Buf ...
- Django生成PDF显示在网页上以及解决中文显示乱码的问题
项目地址:https://github.com/PythonerKK/django-generate-pdf/tree/master 这个demo实现了通过用户输入自己的个人信息生成一份简历pdf,来 ...
- python算法与数据结构-数据结构中常用树的介绍(45)
一.树的定义 树是一种非线性的数据结构,是由n(n >=0)个结点组成的有限集合.如果n==0,树为空树.如果n>0,树有一个特定的结点,根结点根结点只有直接后继,没有直接前驱.除根结点以 ...
- 微服务SpringCloud之服务调用与负载均衡
上一篇我们学习了服务的注册与发现,本篇博客是在上一篇的基础上学习服务的调用.上一博客主要创建了Eureka的服务端和一个Client,该Client包含了一个Controller用来提供对外服务供外部 ...
- 【MM系列】SAP 采购订单的批量修改
公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[MM系列]SAP 采购订单的批量修改 前言 ...
- 使用OpenAPI构建更智能的API
像OpenAPI这样的API描述规范是一个关键工具,您应该尽可能地将其好好掌握,记录和执行API的工作由计算机和开发人员完成:OpenAPI 3.0现在允许额外的表现力,可以让机器为我们做更多有用的工 ...
- CAD2014学习笔记-图纸布局和打印输出
基于 虎课网huke88.com CAD教程 图纸设计规范:施工图 封面设计:地点.名称.设计人 目录设计:施工图编号.名称.意义.对应页数.注释.图号序号:包括平面.立面.大样图.施工图 设计说明/ ...
- 企业如何从“API优先”的策略中获益
在过去的几年里,全球API经济在以难以置信的速度进行快速地增长.物联网.人工智能.自动驾驶等等众多令人充满期待的技术正蓬勃发展,这也证明了API对于如今整个技术圈子的重要性,也预示着在不久的将来它还将 ...
- Spark on YARN资源申请
1.spark submit参数 $ ./bin/spark-submit --class path.to.your.Class --master yarn --deploy-mode cluster ...