js进阶 10-1 JQuery是什么
一、总结
一句话总结:
1、两种引用jquery的方法?
可以在线jquery和本地jquery两种
2、jquery主要好处?
浏览器兼容问题
二、js进阶 10-1 JQuery是什么
1、相关知识点:JQuery概述
1.JQuery简介
- JQuery是一个JavaScript库。极大地简化了JavaScript编程。
- JQuery拥有强大的选择器支持,支持CSS1-CSS3几乎所有的选择器,以及JQ独创的高级而复杂的选择器。
- 解决了不同浏览器间的兼容问题
- 代码简洁,功能强大,易于理解......
2.JQuery的引入
注:jquery1.x版本支持IE 6/7/8;jquery-2.x以上版本不再支持IE 6/7/8
目前最新版本为jquery-3.1.1(最新),大家可以随时关注官网最新版本的动态,对于初学者来说,看教程的时候,你看以前版本的教程书籍依然有用,很对新版本增加的功能对于初学者未必用得上,另你掌握了一个版本的用法之后,即使版本后续有更新,只要关注更新部分即可,不会对学习造成太大的困扰.......
JQuery各版本下载地址
- 官网下载到本地引入
- 百度压缩版本引用地址1:
http://libs.baidu.com/jquery/2.0.0/jquery.min.js - 百度压缩版本引用地址2:
https://code.jquery.com/jquery-3.1.1.min.js
.....
3.JQuery的语法
基础语法是:$(selector).action()
- 美元符号定义JQuery
- $就是jquery对象
- $是JQuery中选取元素的符号
- $是JQuery中功能函数的前缀(功能函数后边再讲)
- $就是jquery对象
- 选择符(selector)"查询"和"查找"HTML元素
- JQuery的action()执行对元素的操作
4.document.ready和window.onload的区别
Jquery中$(document).ready()的作用类似于传统javaScript中的window.onload方法,不过与window.onload方法还是有区别的。
- $(function(){})和$(document).ready(function(){})这两个方法的效果都是一样的,都是在dom文档树加载完之后执行一个函数 Window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
- Window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
- Window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个$(document).ready()可以同时编写多个,并且都可以得到执行
2、代码
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>演示文档</title> 6 <!-- <script type="text/javascript" src="jquery-3.1.1.min.js"></script> --> 7 <!-- <script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> --> 8 <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 9 <script type="text/javascript"> 10 $(function(){ 11 alert('hello,jQuery!') 12 }) 13 </script> 14 </head> 15 <body> 16 17 </body> 18 </html>