JQuery安装与下载教程(jQuery)
jQuery安装与下载
- JQuery 是一个javaScript库,是一个轻量级的”写的少,做的多”的JavaScript库。
- jQuery 极大地简化javaScript编程
–juery相比js优点:
- jquery的onload加载事件速度更快,并且多个加载并行
- 【jq绑定事件都是使用的事件函数,不需要加on】;
- js的onload加载事件,后面的覆盖前面的;
- 在jQuery中,$( )是其运行环境;
- jQuery的模块可以分为3部分:入口模块、底层支持模块和功能模块。
— jQuery库包含以下功能:
- HTML 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
- AJAX
- Utilities
1、jQuery的版本下载网址:http://www.jq22.com/jquery-info122
找到要下载的版本,点击下载
2、下载hBuilder并运行hBuilder , 在hBuilder中创建一个web项目
下载地址:http://www.dcloud.io/
在主页面轮播图中点击HBuilder界面进入下载。
这里根据自己的电脑来选择,我们尽量下载下面的版本,功能强大点,可以支持app开发。
3、下载好之后进行安装,并且新建项目名称为Jquery练习
将第一步中下载好的jQuery资源包进行解压,将解压好的.js文件移动到自己的web项目js包里面。
4、引入资源文件,并测试是否引加载成功,如果是undefinition 就没有引入。
创建一个html页面,将jQuery的min.js 的资源文件。
<!-- 引用jQuery 资源文件 -->
<script type="text/javascript" src="../js/jquery-3.3.1.min.js" ></script>
<title>JQuery 练习</title>
<!-- 测试JQuery 是否加载 如果是undefinition 就是没引入。-->
<script>
if(typeof jQuery== "undefined"){
window.alert("jQuery引用失败!");
}else{
window.alert("jQuery引用成功!");
}
</script>
5、创建一个简单的项目,显示/隐藏 文本框
<!– 引用jQuery 资源文件 –>
<script type="text/javascript" src="../js/jquery-3.3.1.min.js" ></script>
<title>JQuery 练习</title>
<p id="demo">这是一个文本框</p>
<button onclick="hide()">点击隐藏文本</button><br />
<button onclick="show()">点击显示文本</button>
<script>
//隐藏文本
function hide(){
$("#demo").hide();
}
//显示文本
function show(){
$("#demo").show();
}
</script>