jQuery environment construction

Building jQuery's operating environment

Provides three download paths:

1. jQuery's online introduction path.

http://code.jquery.com/jquery-3.1.1.min.js

The above address is the total download list, which contains many versions and types of jQuery libraries, mainly Divided into the following categories:

min: compressed jQuery class library, used in the formal environment. For example: jquery-3.1.1.min.js

vsdoc: in Visual Studio This version of the jquery class library needs to be introduced to enable intelligent sensing. For example: jquery-3.1.1-vsdoc2.js

release package: It contains uncompressed jquery code, as well as documentation and sample programs. For example: jquery -3.1.1-release.zip

2. You can also download the latest version from the jQuery official website. The download address is: http://jquery.com/download/

After downloading, it is a js file, we only need to introduce this js file into the html file.

3. The latest version of jQuery is also available for download at the github address containing the source code. The address is:

https://github.com/shiyanlou/jQuery-base-code

Note: The jquery-3.1.1js version included in the github address is the file used in this course. jquery-1.11.2.min.js is the latest version of jQuery when the course is released, and it is a compressed version.

Next Section

new file

<!doctype html>
<html lang="zh">
<head>
 <meta charset="utf-8"/>
 <title>Hello World jQuery!</title>
 <script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
<div id="divMsg">Hello jQuery!</div>
<input id="btnShow" type="button" value="show" />
<input id="btnHide" type="button" value="hidden" /><br/>
<input id="btnChange" type="button" value="change content is Hello World, too!"/>
<script>
 $("#btnShow").bind("click", function(event) {
 $("#divMsg").show();
 });

 $("#btnHide").bind("click", function(event) {
 $("#divMsg").hide();
 });

 $("#btnChange").bind("click", function(event) {
 $("#divMsg").html("Hello World, too!");
 });
</script>
</body>
</html>

submit Reset Code

Automatic operation

Full Screen