ktv骰子牛牛怎么玩

書名： jQuery權威指南（第2版）
作者名：陶國榮著
本章字數： 724字
更新時間： 2018-12-31 23:37:04

1.2 搭建jQuery開發環境

由于jQuery是一個完整的JavaScript文件庫，因此，搭建jQuery開發環境十分簡單，無須安裝任何文件，只需要先在jQuery官方網站下載最新的文件庫，然后將該文件庫引入頁面中的<head>元素間即可。

1.2.1 下載jQuery文件庫

在jQuery的官方網站（http:// jquery.com）下載最新版本的jQuery文件庫，其網站頁面如圖1-1所示。

在網站中，選擇大小為32KB的壓縮包，單擊下載按鈕，便可以將最新版的jQuery框架下載到本地；目前最新版本為v1.8.2。

圖1-1 jQuery官方網站

1.2.2 引入jQuery文件庫

下載完jQuery框架文件后，并不需要任何的安裝，僅需要使用<script>文件導入標記，將jQuery框架文件jquery-1.8.2.min.js導入頁面中即可。假設該文件下載后保存在項目文件夾Jscript中，那么，在頁面的<head></head>中加入如下代碼：

<script language="javascript" type="text/javascript" src="Jscript/jquery-1.8.2.min.js"></script>

在頁面的頭部分加入上述代碼后，便完成了jQuery框架的引入，現在可以開始我們的jQuery之旅了。

1.2.3 編寫第一個簡單的jQuery程序

首先，我們來編寫一個簡單的程序，見示例1-1。

示例1-1 編寫第一個簡單的jQuery程序

（1）功能描述

當頁面加載時，以居中的方式在頁面中顯示“您好！歡迎來到jQuery的精彩世界。”字樣。

（2）實現代碼

新建一個HTML文件1-1.html,加入如下代碼：

<!DOCTYPE html>
<html>
<head>
    <title>第一個簡單的jQuery程序</title>
    <style type="text/css">
       div{padding:8px 0px;font-size:12px;text-align:center;border:solid 1px #888;}
    </style>
    <script src="JScript/jquery-1.8.2.min.js"
            type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("div").html("您好！歡迎來到jQuery的精彩世界。");
        });
    </script>
</head>
<body>
    <div></div>
</body>
</html>

（3）頁面效果

頁面效果如圖1-2所示。

圖1-2 第一個jQuery程序

（4）代碼分析

在上述文件的代碼中，有一段如下的代碼：

$(document).ready(function(){
                //程序段
           })
該段代碼類似于傳統的JavaScript代碼：
window.onload=function(){
             //程序段
           }

雖然上述兩段代碼在功能上可以互換，但它們之間又有許多區別：

執行時間不同：$(document).ready在頁面框架下載完畢后就執行；而window.onload 必須在頁面全部加載完畢（包含圖片下載）后才能執行。很明顯前者的執行效率高于后者。
執行數量不同：$(document).ready可以重復寫多個，并且每次執行結果不同；而 window.onload盡管可以執行多個，但僅輸出最后一個執行結果，無法完成多個結果的輸出。

$(document).ready(function(){})可以簡寫成$(function(){})，因此下面的代碼是等價的。

$(document).ready(function(){
              //程序段
           })
//等價于
$(function(){
              //程序段
           })

官术网_书友最值得收藏!

jQuery權威指南（第2版）

1.2 搭建jQuery開發環境

1.2.1 下載jQuery文件庫

1.2.2 引入jQuery文件庫

1.2.3 編寫第一個簡單的jQuery程序

示例1-1 編寫第一個簡單的jQuery程序