在前面学习了函数,以及事件函数,如果有很多很多函数需要写,这时就大家就会想到一个方法,把这些函数收集起来,形成一个库,给大家共享使用,就不用每一个人都从头写起了,这样可以节省大量工作量。因此,使用成熟的库,就成为JS开发人员必备的知识点了。而在这么多库里,最有名的就是jquery库。它倒底是什么库?有什么样的功能呢?它的官方网站介绍如下:
jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.
它主要特点,就是快、小和功能丰富,可以快速实现HTML文档遍历,操作,事件处理,动画,和ajax交互;同时也支持多浏览器。
既然这么好的库,怎么样下载来使用呢?
要到官方的网站
https://jquery.com/,然后点击Download jQuery v3.3.1字符串,就来到下面的页面:
在这里有两个版本,一个是压缩jQuery版本文件,另一个是非压缩的版本,两个版本的差别是压缩的版本为了节省空间,减少加载时间设计的,另一个非压缩版本是方便开发、调试的,有注释可以看得明白代码是做什么用的。
jquery-3.3.1.js是非压缩版本,文件大小为266KB, jquery-3.3.1.min.js是压缩版本, 文件大小为85KB。
保存到目录里,就可以像下面的例子来使用:
代码如下:
<html>
<head>
<title>
使用事件的例子
</title>
<script type="text/JavaScript" src="jquery/jquery-3.3.1.js"></script>
</head>
<script type="text/JavaScript">
jQuery(document).ready( function(){
jQuery('h1').click( function(event){
alert("jQuery在工作中!");
});
});
</script>
<body>
<h1>window.onload事件</h1>
</body>
</html>
在这里通过这行代码:
<script type="text/JavaScript" src="jquery/jquery-3.3.1.js"></script>
来导入jquery库。
使用jQuery的ready事件,当点击h1标题时,就会调用编写的警告函数弹出来,运行结果如下: