搭建jQuery开发环境
每个版本又分为一下两种:开发版和生产版:
版本 大小/KB 描述
jquery-1.x.js 约288 开发版,完整无压缩,多用于学习,开发和测试
jquery-2.x.js 约251 开发版,完整无压缩,多用于学习,开发和测试
jquery-1.x.min.js 约94 生产版,经过压缩工具压缩,体积相对比较小,主要勇于产品和项目中
jquery-2.x.min.js 约83 生产版,经过压缩工具压缩,体积相对比较小,主要勇于产品和项目中
在页面中使用jQuery分为两步:首先引入jQuery库,然后使用jQuery实现界面操作。
项目1引入jQuery库
jQuery不需要安装,只需要将下载的jQuery库放到站点的一个公共目录中,然后在页面中通过 < script > 标签引入即可。
<script type="text/javascipt" src="js/jquery-1.x.js"></script>
1
jQuery简单测试
在页面中引入jQuery库后,通过$ ()函数来获取页面中的元素,并对元素进行定位或效果处理。在没有特别说明的情况下,$ 符号即为jQuery对象的缩写形式,例如$(“myDiv”)与jQuery(“myDiv”)完全等价。
<!doctype html>
<head>
<meta charset="utf-8">
<title>测试示例</title>
<script type="text/javascipt" src="js/jquery-1.x.js"></script>
</head>
<body>
<div id="myDiv"> Hello World!</div>
<script type="text/javascript">
$(document).ready(fucntion(e){
//alert(jQuery("#myDiv").html());
alert($("#myDiv").html());
});
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
上述代码中,通过jQuery读取< div>标签中的内容,$(document).ready()方法的作用类似于JavaScript中window.onload事件,但也有一定区别:
区别项 window.onload $(document).ready()
执行时间 必须在页面全部加载完成(包含图片下载)后才能执行 在页面中所有DOM结构下载完毕后执行,此时可能DOM元素关联的内容并没有加载完毕
执行次数 一个页面只能有一个,当页面中存在多喝window.onload时,仅输出最后一个的结果明晚发完成多个结果同时输出 一个页面可以有多个,结果可以相继输出
简化写法 无 可以简写成$(http://www.my516.com)
---------------------
搭建jQuery开发环境的更多相关文章
- 在DW 5.5+PhoneGap+Jquery Mobile下搭建移动开发环境
移动设备应用开发有多难,只要学会HTML5+Javascript就可以.用Dreamweaver5.5+PhoneGap+Jquery Mobile搭建移动开发环境,轻轻松松开发你自己的应用.让你用普 ...
- 使用 VS Code 搭建 TypeScript 开发环境
使用 VS Code 搭建 TypeScript 开发环境 TypeScript 是 JavaScript 的超集,TypeScript 只是增强了 JavaScript 而非改变了 JavaScri ...
- 自定义搭建PHP开发环境
学习了一段时间php了,因为之前是刚接触php,所以用的是集成安装包(wamp).现在想进一步了解apache.mysql.php之间的关系以及提升自己所以进行自定义搭建PHP开发环境.废话不多说,请 ...
- 使用virtualenv搭建python3开发环境
问题描述 环境: CentOS6.5 想在此环境下使用python3进行开发,但CentOS6.5默认的python环境是2.6.6版本. 之前的做法是直接从源码安装python3,替换掉现有的开发环 ...
- Windows下搭建PHP开发环境
PHP集成开发环境有很多,如XAMPP.AppServ......只要一键安装就把PHP环境给搭建好了.但这种安装方式不够灵活,软件的自由组合不方便,同时也不利于学习.所以我还是喜欢手工搭建PHP开发 ...
- 搭建Android开发环境附图详解+模拟器安装(JDK+Eclipse+SDK+ADT)
——搭建android开发环境的方式有多种,比如:JDK+Eclipse+SDK+ADT或者JDK+Eclipse+捆绑好的AndroidSDK或者Android Studio. Google 决定将 ...
- mac os 下搭建android开发环境
mac os 下搭建android开发环境 周银辉 mac os 下搭建android环境比较方便, 如下几个步骤: 1,安装jdk 先搞清楚自己是否已经安装,在命令行下:java -version, ...
- mac 下 用 glfw3 搭建opengl开发环境
mac 下 用 glfw3 搭建opengl开发环境 下载编译 glfw3 Build Setting 里面, Library Search Paths -> 设置好编译 glfw 库的路径 H ...
- 在Eclipse下搭建Android开发环境教程
我们昨天向各位介绍了<在NetBeans上搭建Android SDK环境>,前不久也介绍过<在MyEclipse 8.6上搭建Android开发环境>, 都受到了读者的欢迎.但 ...
随机推荐
- 任务调度(三)——Timer的替代品ScheduledExecutorService简单介绍
先前的两篇博文<任务调度(一)--jdk自带的Timer>和<任务调度(二)--jdk自带的Timer 动态改动任务运行计划>中,简介了一下Timer,能够实现几本的功能.可是 ...
- BZOJ 2208 JSOI2010 连通数 Tarjan+拓扑排序
题目大意:给定一个n个点的有向图,求有多少点对(x,y),使x沿边可到达y 设f[i][j]为从i到j是否可达 首先强联通分量中的随意两个点均可达 于是我们利用Tarjan缩点 缩点之后是一个拓扑图. ...
- 【USACO 2017FEB】 Why Did the Cow Cross the Road III
[题目链接] 点击打开链接 [算法] 树状数组 [代码] #include<bits/stdc++.h> using namespace std; #define MAXN 100010 ...
- php语法错误导致服务器错误(500)解决
PHP编码出错不提示,而是提示500错误,这对于开发来说,是很不方便的.下面讲解如何开启错误提示步骤: 1. 打开php.ini文件.以我的ubuntu为例,这个文件在: /etc/php5/apac ...
- python re正则表达式模块
模块的的作用主要是用于字符串和文本处理,查找,搜索,替换等 复习一下基本的正则表达式吧 .:匹配除了换行符以为的任意单个字符 *:匹配任意字符,一个,零个,多个都能匹配得到 俗称贪婪模式 +:匹配 ...
- RDA Kconfig介绍 ***
安装显示库: sudo apt-get install libncurses5-dev libncursesw5-dev 执行相关文件: 1.radisson.Kconfig 2.gen_radiss ...
- 什么是需求Bug、设计Bug、功能bug?
首先什么是需求Bug.设计Bug.功能bug? 需求Bug,指由于客户需求描述不清晰或错误.需求收集人员自身原因及需求本身模糊难于分析.获取等原因,导致客户需求获取不准确,后期产品不能满足客户.用户的 ...
- C# 判断两个矩形是否相交
源代码 public bool JudgeRectangleIntersect(double RecAleftX, double RecAleftY, double RecArightX, doubl ...
- HTML5中File
一 File对象与FileList对象 当将input元素的type类型设置为file时,web页面上会显示一个选择文本按钮和一个文本显示框,单击文件按钮可以选择一个文件,文本显示框中会显示选中的文件 ...
- Chrome教程之NetWork面板分析网络请求
官方文档:https://developers.google.com/web/tools/chrome-devtools/network/ 最近打算写一写Chrome教程文档,不知道大家最感兴趣的是什 ...