jQuery入门:认识jQuery
jQuery是一个轻量级的JavaScript库,拥有独特的选择器、出色的DOM操作、可靠的事件处理、完善的兼容性、链式操作以及方便的ajax等功能。jQuery的最新版本可在官方网站(http://jquery.com)下载。
1.jQuery库类型(2种)
|
名称 |
类型 |
大小 |
说明 |
|
jquery.js |
开发版 |
约229KB |
完整无压缩版本,主要用于测试、学习和开发 |
|
jquery.min.js |
生产版 |
约31KB |
经过工具压缩或经过服务器开启Gzip压缩,主要用于产品和项目 |
2. jQuery模板
<!-- JQuery.html -->
<!DOCTYPE html>
<html>
<head>
<title>Test JQuery</title>
<script type="text/javascript" src="jquery-3.2.0.js"></script>
</head>
<body>
<!-- add your code here. --> </body>
</html>
3.$(document).ready()
该代码作用类似于JavaScript中的Windows.onload()。不过两者之间仍有以下区别:
|
windows.onload |
$(document).ready() |
|
|
执行时机 |
网页加载完成后 |
DOM结构加载完成后(不必等页面加载完成) |
|
编写个数 |
最多1个 |
任意个 |
|
编码形式 |
windows.onload = function(){ /*…*/}; |
$(document).ready(function(){/*…*/}); |
|
编码简写 |
无 |
$(function(){/*…*/}); |
注意:在jQuery库中,$就是jQuery的简写形式。
jQuery代码必须写在<script type="text/javascript"></script>标签内。
3.1 实例:
<script type="text/javascript">
$(document).ready(function(){
alert("Hello JQuery");
});
</script>
简写形式:
<script type="text/javascript">
$(function(){
alert("Hello JQuery");
});
</script>

4.DOM对象和 jQuery对象
4.1 DOM对象(通过document获取的element对象)
var question = document.getElementById(“question”);
4.2 jQuery对象 (通过$()获取的对象)
注意: 为了方便识别jQuery变量,获取jQuery对象的变量名前面应加上“$”.
var $question = $(“#question”);
5. jQuery对象与DOM对象的相互转换
5.1 jQuery对象转换成DOM对象
jQuery提供了两种方法将jQuery对象转换成DOM对象,即[index]和get(index).
5.1.1 [index]方法
var $question = $(“#question”); //jQuery对象
var question = $question[0]; //DOM对象
5.1.2 get(index)方法
var $question = $(“#question”); //jQuery对象
var question = $question.get(0); //DOM对象
5.2 DOM对象转换成jQuery对象
jQuery对象本质上是就是通过jQuery包装DOM对象后产生的对象所以只需要用$()把DOM对象包装起来就可以获得jQuery对象。
var question = document.getElementById(“question”);
var $question = $(question);
注意:平时用到的jQuery对象都是通过$()函数创造出来的,$()函数就是一个jQuery对象的制造工厂。
如有纰漏,敬请联系!感谢您的支持。
更多内容,请访问:http://www.cnblogs.com/BlueStarWei/
jQuery入门:认识jQuery的更多相关文章
- jquery 入门之-------jquery 简介
什么是jquery? Jquery是一个Javascript库,通过封装原生的Javascript函数得到一套定义好的方法.它可以用个少的代码完成更多更强大更复杂的功能,从而得到开发者的青睐. So! ...
- jQuery入门、jQuery选择器、jQuery操作
一.什么是jQuery及如何使用 1.1 jQuery 简介 jQuery是一个兼容多浏览器的javascript函数库(把我们常用的一些功能进行了封装,方便我们来调用,提高我们的开发效率.),核心理 ...
- JQuery入门
JQuery入门 1 jQuery的概述 1.1 jQuery简介 jQuery是一个 JavaScript函数库,它是一个“写的更少,但做的更多”的轻量级 JavaScript 库.jQuery 极 ...
- JQuery入门篇
JQuery入门篇 jQuery选择器 “$”表示JQuery对象 根据ID查找 $(‘#var’)表示将一个id值为var的DOM节点封装成一个jQuery对象,DOM节点必须以“#”开头. 例如: ...
- jQuery入门(1)jQuery中万能的选择器
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- jQuery入门(2)使用jQuery操作元素的属性与样式
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- jQuery入门(3)事件与事件对象
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- jQuery入门(4)jQuery中的Ajax应用
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- jQuery入门必须掌握的一些API
jQuery 中文版文档:http://www.css88.com/jqapi-1.9/category/ajax/ jQuery入门,必须掌握以下的API,平时工作中经常会用到.未列出的API,在掌 ...
- Web前端JQuery入门实战案例
前端jquery入门到实战 为什么要学习Jquery?因为生活. 案例: <!DOCTYPE html> <html lang="zh-CN"> <h ...
随机推荐
- EFDB 基本规范&知识
public abstract class AccountRole //这是继承类型 { [Key] public int ID { get; set; } public bool isDisable ...
- .NET中利用反射来实现自动映射两个对象中的数据成员
在以前的项目开发之中,经常会遇到这样一个问题:比如在外面项目的架构设计之中,我们采用MVC和EntityFramework来构建一个Web应用程序.比如我们采用常用的多层架构,例如有Presentat ...
- 类中的两大类(string类、math类)的应用
类是我们在学习C#的过程中很关键也是特别容易让人蒙逼得地方,类的应用直接可以调用它的属性和方法来进行判断和验证 string类(也叫字符串类) C#中的String类很有用,下面是一些它的常用方法的总 ...
- Java程序通过代理访问网络
问题背景 最近工作上有开发爬虫的任务,对目标网站数据进行抓取,由于大部分网站都在国外,无法直接访问,需要通过代理才能登录.爬虫部署的服务器在香港,所以爬虫部署到服务器后,是可以访问目标网站的,但本地开 ...
- oracle数据库命令-持续更新
一.系统命令 登录 dba用户命令 sqlplus / as sysdba 2. 用户命令 删除用户 DROP USER **** CASCADE; DROP SCHEMA **** CASCADE; ...
- [BNUZOJ1261][ACM][2016北理校赛]方块消除(栈,字符串)
玩过方块消除游戏吗?现在规定当有两个或两个以上相邻且颜色相同的方块在一起的时候,它们就会产生消除反应.当存在多个消除反应同时产生时,最下的反应先执行.现在只给你其中一列,求最后剩下的方块结果. 输入要 ...
- ASP渲染下拉框使时间依次减少
<% x=year(now()) y=year(now())-1 Do While y>2002%><li><a href="#201 ...
- JavaScript实现评论点赞功能
通过分析评论功能的逻辑关系,学会如何使用JavaScript实现评论.回复.点赞等各种功能 1.学会JavaScript处理日期和时间. 2.掌握Dom操作中的添加/删除子节点方法. 3.使用setT ...
- iOS性能之HTTP2.0
在移动互联网领域蓬勃发展的今天,APP的性能也成为各大公司重点关注的方向,该系列文章主要针对iOS的性能的几个方面做一些研究. 什么是HTTP2.0? 网上很容易搜到关于HTTP2.0的概念的文章,这 ...
- 如何在appconfig中配置服务的ip
开发了一个WindowsService消息服务器,刚开始一直都是在代码中把IP地址写死,所以每次只要是更换了新的IP地址后,都需要重新编译项目.所以考虑把ip配置到config文件中, 这样做的好处是 ...