下载JQuery
目前jQuery有三个大版本:
1.x:兼容ie678,应用最为宽泛的,官网只做BUG保护,性能不再新增。因而个别我的项目来说,应用1.x版本就能够了,
2.x:不兼容ie678,很少有人应用,官网只做BUG保护,性能不再新增。如果不思考兼容低版本的浏览器能够应用2.x,
3.x:不兼容ie678,只反对最新的浏览器。除非特殊要求,个别不会应用3.x版本的,很多老的jQuery插件不反对这个版本。目前该版本是官网次要更新保护的版本。
注:jquery-xxx.js与jquery-xxx.min.js区别:jquery-xxx.js是开发版本,给程序员看的,有良好的缩进和正文,体前端培训积大一些。jquery-xxx.min.js:生产版本,程序中应用,没有缩进,体积小一些,程序加载更快。
导入JQuery的js文件
间接导入min.js文件即可。比方:
<script src="js/jquery-3.3.1.min.js"></script>
JQuery对象和JS对象
区别与转换
①区别
JQuery对象在操作时,更加不便。
JQuery对象和js对象办法不通用的。
②转换
jq-->js:jq对象[索引] 或者 jq对象.get(索引)
js-->jq:$(js对象)
JQuery的简略应用
①事件绑定
比方,点击id为b的按钮弹出提示框。
JQuery代码如下:
$("#b").click(function(){
alert("b");
});
作用雷同的JS代码如下,能够显著看出JS代码更简单一些。
document.getElementById("b").onclick=function () {
alert("b");
}
②入口函数
入口函数就是以后页面加载实现后运行的函数,JQuery代码如下:
$(function () {
alert("页面加载实现");
});
而JS代码如下:
window.onload = function () {
alert("页面加载实现");
};
注:window.onload和$(function)区别:window.onload只能定义一次,如果定义屡次,后边的会将前边的笼罩掉;而$(function)能够定义屡次。
③款式管制
比方,设置id为div1的元素背景色彩为红色。JQuery代码如下:
$("#div1").css("background-color","red");
或者:
$("#div1").css("backgroundColor","red");
等价于JS代码:
document.getElementById("div1").style.backgroundColor="red";