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下载以及基本语法)的更多相关文章

  1. jQuery入门、jQuery选择器、jQuery操作

    一.什么是jQuery及如何使用 1.1 jQuery 简介 jQuery是一个兼容多浏览器的javascript函数库(把我们常用的一些功能进行了封装,方便我们来调用,提高我们的开发效率.),核心理 ...

  2. jquery 入门之-------jquery 简介

    什么是jquery? Jquery是一个Javascript库,通过封装原生的Javascript函数得到一套定义好的方法.它可以用个少的代码完成更多更强大更复杂的功能,从而得到开发者的青睐. So! ...

  3. JQuery入门

    JQuery入门 1 jQuery的概述 1.1 jQuery简介 jQuery是一个 JavaScript函数库,它是一个“写的更少,但做的更多”的轻量级 JavaScript 库.jQuery 极 ...

  4. JQuery入门篇

    JQuery入门篇 jQuery选择器 “$”表示JQuery对象 根据ID查找 $(‘#var’)表示将一个id值为var的DOM节点封装成一个jQuery对象,DOM节点必须以“#”开头. 例如: ...

  5. jQuery入门(4)jQuery中的Ajax应用

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  6. 第一百六十二节,jQuery入门介绍

    jQuery入门 学习要点: 1.什么是  jQuery 2.学习 jQuery的条件 3.jQuery的版本 4.jQuery的功能和优势 5.其他 JavaScript库 6.是否兼容低版本  I ...

  7. jQuery入门和DOM对象

    jQuery入门和DOM对象 1.开发准备 1. 下载的版本: jquery-3.3.1.min.js :压缩版,发布版84.8KB jquery-3.3.1.js :常规版,开发版265KB 2. ...

  8. jQuery入门(1)jQuery中万能的选择器

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  9. 第 1 章 jQuery 入门

    学习要点: 1.什么是 jQuery 2.学习 jQuery 的条件 3.jQuery 的版本 4.jQuery 的功能和优势 5.其他 JavaScript 库 6.是否兼容低版本 IE 7.下载及 ...

随机推荐

  1. 3023Java_控制语句

    控制语句 0.前定义 语句块(有时叫做复合语句),是用花括号扩起的任意数量的简单Java语句. 块确定了局部变量的作用域.块中的程序代码,作为一个整体,是要被一起执行的. 块可以被嵌套在另一个块中,但 ...

  2. Dynamics 365 Document Management

    Dynamics CRM中的Document Management功能需要Dynamics CRM与SharePoint进行集成,也就是实现在CRM中上传Document,实际上Document最终存 ...

  3. 12 jQuery的ajax

    什么是ajax AJAX = 异步的javascript和XML(Asynchronous Javascript and XML) 简言之,在不重载整个网页的情况下,AJAX通过后台加载数据,并在网页 ...

  4. win10安装docker

    配置首先需要Hyper-v和容器,这样就可以运行Linux的镜像了 如果是win10home版或者是其他版本就需要安装visulbox了, 然后去官网https://www.docker.com/pr ...

  5. Kafka 学习之路(一)—— Kafka简介

    一.简介 Apache Kafka是一个分布式的流处理平台.它具有以下特点: 支持消息的发布和订阅,类似于RabbtMQ.ActiveMQ等消息队列: 支持数据实时处理: 能保证消息的可靠性投递: 支 ...

  6. npm设置淘宝代理

    npm config set registry https://registry.npm.taobao.org npm info underscore

  7. HTML和CSS 基本要点必看

    今天的课程名称叫HTML和CSS HTML:它是标记语言,全称为超文本标记语言,它不是编译语言.(说白了就是标签) CSS:它是给标签添加样式的,全称为层叠样式表. 想了解这些必须得知道两个东西 一是 ...

  8. visudo 与 /etc/sudoers

    增加多个用户免密码登录 User_Alias USER_OPS = zouyi,hanerhui,shibeibei,gaoxudong,xiaoyuelin,wangsongfeng,sunjian ...

  9. 职业生涯之完成OCM考试后的感想

    背景知识:关于OCM认证,百科是这样描述的: Oracle Certified Master(OCM) 大师认证资质是Oracle认证的最高级别.此认证是对技术.知识和操作技能的最高级别的认可.Ora ...

  10. Python的函数, 返回值, 参数

    1. 函数 函数是对功能的封装 语法: def 函数名(形参): 函数体(代码块,return) 调用: 函数名(实参) 2. 返回值 return:在函数执行的时候, 遇到return 就直接返回, ...