1、ppt課件.1Window 對象詳解ppt課件.2Window 對象 Window對象也叫做窗口對象，他是javascript瀏覽器對象層次中的最頂層對象。Window對象的下面有很多子對象，例如document對象、navigator對象、location對象等。Window對象的子對象會在后面一一講解。ppt課件.3第一章 打開和關閉窗口 對窗口的操作首先應該學會的就是打開和關閉窗口。打開和關閉窗口是學會窗口的基礎，他很簡單，但卻非常的重要。用戶可以直接啟動瀏覽器打開一個窗口，并顯示主頁。也可以使用瀏覽器的中的菜單命令來打開一個窗口。但是在這里主要學習怎么樣通過程序來打開一個新窗口。ppt

2、課件.41.1 打開窗口 在javascript中為Window對象定義了open方法來打開一個新的窗口。在open方法中最少有兩個參數，最多可以有四個參數，后面的兩個參數是可選的。 第一個參數表示要打開窗口的URL，該URL可以使網絡中的特定的頁，也可以是本地的HTML文檔。如果是本地的HTML文檔，就分為是使用相對路徑還是使用絕對路徑。也就是說如果與該程序在同一目錄下就可以直接給出該文檔的名稱，不在同一目錄下的就需要給出完整的URL。 Open方法還可以為空，表示打開一個空白文檔。創建空白文檔后可是使用document.write方法來寫入HTML語句。需要注意的是HTML的內容必須組成一

3、個長字符串。ppt課件.51.1 打開窗口 Open方法的第二個參數指的是新創建窗口的名稱。該新創建窗口的名稱既不是HTMl文檔中的標題名，也不是創建的Window對象名。所定義的名稱在程序的后面很少用到，該名稱主要用于判斷打開的窗口是哪一個，如果兩次打開的窗口名稱不一樣，則打開兩個窗口；如果兩次打開的窗口名稱相同，則在第一次打開的窗口內打開第二個窗口。ppt課件.61.1 打開窗口代碼1：Window對象open方法的使用Window對行啊open方法的使用!-var newwindow1 = open(,name1);newwindow1.document.write(窗口一窗口一);va

4、r newwindow2 = open(,name2);newwindow2.document.write(窗口二窗口二);/-ppt課件.71.1 打開窗口代碼二：Window對象open方法的使用Window對行啊open方法的使用!-var newwindow1 = open(,name1);newwindow1.document.write(窗口一窗口一);var newwindow2 = open(,name1);newwindow2.document.write(窗口二窗口二);/-ppt課件.81.1 打開窗口 從前兩個程序和運行結果可以看出，當使用open方法來創建新窗口時，如

5、果使用兩個不同名稱，就會創建兩個窗口，如果使用兩個相同的名稱，就會只創建一個窗口。使用多個open方法時，如果方法中的第二個參數也就是窗口名相同，就不會創建多個窗口；如果open方法中的URL指定的特定的網頁，得到的將是最后一個open方法中的URL指定的網頁。ppt課件.91.2 打開窗口屬性設置 本節將繼續講解使用open方法來打開一個新窗口，這里主要講解open方法中的兩個可選參數。Open方法的第三個參數指設置打開的新窗口效果，該參數是默認的，如果沒有該參數，則顯示窗口中的所有效果，并顯示默認大小。ppt課件.101.2 打開窗口屬性設置 Location是否顯示地址欄 yes/no

6、1/0 Menubar是否顯示菜單欄yes/no 1/0 Resizable 是否允許改變大小yes/no 1/0 Scrollbars 是否顯示滾動條yes/no 1/0 Status是否顯示狀態欄 yes/no 1/0 Toolbar是否顯示工具欄 yes/no 1/0 Height新窗口高度 整數值 width新窗口寬度 整數值 需要注意的是，參數boolean值不是使用true和false來表示。表示true值可以用yes、1或者屬性名；表示false值可以使用no或0.將需要的所有效果組成一個長字符串作為第三個參數，效果之間使用逗號分隔。當這只一些效果后，則沒有設置的效果值都為fal

7、se，沒有設置高度和寬度就顯示默認的高度和寬度。ppt課件.111.2 打開窗口屬性設置 窗口的效果不只是這些，這些知識比較常用的。在特定的瀏覽器中，都有自己的窗口效果。由于它只對一部分的瀏覽器起作用，所以它們有使用局限。這里就不多對這部分的內容進行講解。 Open方法的第四個參數是一個布爾值，他表示是否允許指定的URL替換原窗口中的內容。它很少用到，而且它只使用于已經常見的窗口。所以這里不多做介紹。ppt課件.121.3 關閉窗口 在上面的兩小節中隊打開窗口進行了講解，在本節中就來學習如何關閉窗口，在講解打開窗口時，使用open方法不需要任何的對象來調用，但是用來關閉窗口close方法就需要

8、一個窗口對象來調用，該對象名稱就是使用open方法創建的對象窗口名稱。ppt課件.131.3 關閉窗口代碼：window對象close方法的使用window對象close方法的使用ppt課件.141.3 關閉窗口在上面講的是在主窗口中關閉子窗口，不但這樣，還可以使用子窗口來關閉主窗口。這里用到了self和opener等還沒學到的知識這里只需要知道它們代表主窗口就可以了，在創建主程序之前，先看看名為“newwindow.html”的子程序代碼。新窗口程序新窗口程序ppt課件.151.3 關閉窗口主程序代碼window對象close方法的使用window對象close方法的使用ppt課件.16第二

9、章 對話框 在上一節中最后引出了對話框的知識，在以前的學習中也已經多次使用到了對話框。使用對話框可以很好的實現與用戶進行交互。交互的方式有很多，如最常用的顯示內容在頁面上，但是這樣不能很好的引出用戶的注意。使用對話框就能很好的彌補這一點，當彈出對話框時，用戶必須進行操作，程序才能進行下去。在javascript中定義了信息對話框，選擇對話框和提示對話框，在本節中就對這些對話框進行詳細的講解。ppt課件.172.1 信息對話框 使用信息對話框來告訴用戶一些信息。信息對話框中通常具有兩個信息，一部分是要傳給用戶的信息，另一部分是一個按鈕。在中文瀏覽器中，按鈕的內容是“確定”，在英文的瀏覽器中，是“

10、ok”。 在javascript中通過使用window對象的alert方法來創建一個信息對話框。使用alert方法的基本格式為: Window.alert(“message”); 由于Window對象的特殊原因，也可以簡寫為如下形式。 Alert.(“message”);ppt課件.182.1 信息對話框代碼： 信息對話框信息對話框ppt課件.192.1 信息對話框 上面的程序是使用alert方法創建信息對話框為用戶提供信息。Alert方法中的參數是一個字符串，不但這樣，它還可以是其他數據類型。這是因為javascript是一種靈活的語言，它自動將其他數據轉換成字符型。除了這些，alert方法

11、的參數還可以是一個表達式，這也是很有用的，經常被應用在程序調試和測試上。ppt課件.202.1 信息對話框代碼： 信息對話框信息對話框ppt課件.212.1 信息對話框在上面的程序中只有一個對話框，但是在日常生活中是不會只用一個信息對話框的。 信息對話框信息對話框!-document.write(顯示的是第一個對話框.);alert(第一個信息對話框);document.write(顯示的是第二個對話框.);alert(第二個信息對話框)document.write(不在顯示對話框.);/-ppt課件.222.2 選擇對話框 在javascript中，還有一種對話框就是選擇對話框。在信息對話框

12、中為用戶提供了一條信息，而在選擇對話框中是為用戶提供一個問題，由用戶決定程序的走向。在javascript中使用confirm方法來創建一個選擇對話框，confirm方法創建選擇對話框的基本形式為： Confirm(“message”); 在confirm方法中也只需要一個字符串，來提供一個問題。ppt課件.232.2 選擇對話框代碼1選擇對話框選擇對話框ppt課件.242.2 選擇對話框代碼2選擇對話框選擇對話框用戶名密碼ppt課件.252.2 選擇對話框 前面的兩個程序中都沒有起到選擇的作用，無論選擇哪個按鈕，結果都一樣。選擇對話框被用戶選擇以后返回的是一個boolean值，選擇“確定”按

13、鈕，返回值為true；如果選擇“取消”按鈕，返回值為false。因此可以利用選擇對話框的返回值進行操作。ppt課件.262.2 選擇對話框代碼3：選擇對話框選擇對話框!-function myfunction()if(confirm(別人可能看到你的密碼，是否確認提交)document.write(開始提交);elsedocument.write(取消提交)/-用戶名密碼ppt課件.272.2 選擇對話框從程序的代碼中可以看出，將整個confirm方法作為循環條件很會長，所以可以將confirm方法的結果賦給一個變量，然后使用變量名進行操作。選擇對話框選擇對話框!-var boolean =

14、confirm(別人可能看到你的密碼，是否確認提交);if(boolean)document.write(開始提交);elsedocument.write(取消提交)/-ppt課件.282.3 提示對話框 前面學習的兩種對話框，只需要用戶通過鼠標進行，在本節中來學習一種需要通過鍵盤進行操作的對話框，那就是提示對話框。在提示對話框中有一條提示信息、一個需要用戶填寫的文本框和“確定”、“取消”這兩個按鈕。 在javascript中，使用prompt方法來創建一個提示對話框。Prompt方法和alert方法和confirm方法有所不同，他通常具有兩個參數。Prompt方法的第一個參數是一個字符串，為

15、提示對話框中的提示消息，第二個參數是可選的，為文本框的默認信息。通常情況下，都給出該方法的第二個參數，也就是給出文本框的默認信息，默認信息為用戶起到提示的作用。ppt課件.292.3 提示對話框代碼：提示對話框提示對話框!-var sstring = prompt(請輸入你的名字,Tom);document.write(你好,+sstring+歡迎你訪問本網站);/-ppt課件.302.3 提示對話框 從運行結果可以看出，輸入的內容作為一個字符顯示在頁面上。在提示對話框中，不管輸入的是什么內容，當用戶單擊“取消”按紐時，提示對話框的返回結果都為null。并使用null來操作。在實際開發中是不希

16、望看到這樣的結果的。在實際使用prompt方法時，通常需要先設置當提示對話框的返回值為null時的操作。ppt課件.312.3提示對話框代碼：提示對話框提示對話框=60)alert(恭喜你，你及格了);elsealert(很遺憾，你沒有及格);/-由于提示對話框返回的值為字符型，所以需要先將提示對話框的返回值使用parseIn全局函數轉換成數值型。ppt課件.322.3 提示對話框 在上面的幾個程序中，都是結合地使用了信息對話框和提示對話框，同時它們也可以嵌套使用。這種使用很少見到，但是它大大的縮短了程序的長度。ppt課件.33 第三章 對窗口的操作 由于Window對象表示的就是瀏覽器打開的

17、窗口，所以對窗口的操作就是對Window對象的操作。在前一節中講到了打開和關閉窗口也就是對窗口的曹組哦，只是由于它們比較基礎就放在前面講。在本節中就來講解其他對窗口的曹組，如移動、縮放和滾動窗口。ppt課件.343.1 移動窗口 在javascript中定義了兩種不同的方法來移動窗口，分別是moveBy方法和moveTo方法。先來看看moveBy方法，moveBy方法可以說是相對移動，他的基本使用形式為： Windowname.moveBy(num1,num2); 其中windowname為要移動的窗口的名稱，如果不給出則表示移動的為主窗口。moveBy方法具有兩個參數。第一個參數表示水平方向

18、上的窗口的相對移動的像素，正數表示向右移動，負數則表示向左移動。第二個參數表示垂直方向上的窗口相對移動的像素，正數表示向下移動，負數表示向上移動。為了更好地理解窗口的相對移動，在下面的程序中定義了兩個按鈕，單機該按鈕則相對移動指定的像素。ppt課件.353.1 移動窗口代碼1：移動窗口移動窗口ppt課件.363.1 移動窗口 除了可以使用moveBy方法讓窗口相對移動外，還可以使用moveTo方法讓窗口移動到指定的位置。moveTo方法的使用基本形式為： Windowname.moveTo(num1,num2); 該方法和moveBy方法十分相似。其中windowname為要移動的窗口名稱，如

19、果不給出則表示移動的為主窗口。moveTo方法既有兩個參數。第一個參數表示窗口 x軸的坐標數。第二個參數表示窗口y軸的坐標數。下面就是用moveTo方法將窗口移動到原點位置。ppt課件.373.1 移動窗口代碼2：移動窗口移動窗口移動窗口移動窗口ppt課件.383.2 縮放窗口 縮放窗口就是改變窗口大小，它和移動窗口很相似。在javascript中，定義了resizeBy方法和resizeTo方法來縮放窗口，它們分別為相對縮放窗口和絕對縮放窗口。使用resizeBy方法的基本形式為： Windowname.resizeBy(num1,nun2); resizeBy方法中有兩個參數。第一個參數表

20、示水平方向上的相對縮放的像素，整數表示將窗口放大，負數表示將窗口縮小。第二個參數表示垂直方向上窗口相對縮放的像素，同樣也是整數表示將窗口放大，負數將窗口縮小。當放大窗口時，窗口的左上角不動，而是向上和向右放大。當縮小窗口時，也是窗口左上角不懂，且向上和向左縮小。ppt課件.393.2 縮小窗口代碼1:縮放窗口縮放窗口ppt課件.403.2 縮小窗口 在對窗口進行縮放操作時，還有另外一個resizeTo方法，用她來絕對縮放窗口，也就是直接指定窗口的大小。用resizeTo方法基本形式為： Windowname.resizeTo(num1,num2); resizeTo方法的第一個參數表示設定窗口

21、的寬度值，第二個參數表示設定窗口的高度。resizeTo方法的參數都是整數，它們不可能是負數。resizeTo方法的使用和resizeBy方法的使用很相似，這里就不再給出resizeTo方法的程序了。 在對窗口進行縮放操作時，并不能無限地縮放和放大窗口。如不能縮小窗口到寬度值為1像素，高度值為1像素的小窗口。或將窗口放大到顯示屏幕不能完全顯示時，就另外需要其他的操作來完成，所以最好不要將窗口的大小放大到超過顯示屏幕。ppt課件.413.3 滾動窗口 滾動窗口和移動窗口很相似，只是移動窗口是移動整個窗口，而滾動窗口是窗口不動，窗口中的內容進行滾動。在javascript中，定義了scrollBy

22、方法和scrollTo方法來滾動窗口，它們分別為相對滾動窗口和絕對滾動窗口。這兩種方法的使用和移動窗口的方法很相似，這里就不再進行講解。ppt課件.423.3 移動窗口代碼：滾動窗口滾動窗口ppt課件.433.4 打印窗口內容 在javascript中，提供了print方法，使用print方法可以打印窗口中的內容。Print方法的使用和菜單命令中的“打印命令完全相同。Print方法很少被使用到，但是在特定情況下，就可以使用該方法，如需提醒用戶打印。ppt課件.443.4 打印窗口內容代碼：打印窗口內容打印窗口內容此網頁很重要 是否需要打印ppt課件.453.5 窗口狀態欄 窗口狀態欄和窗口內容

23、一樣，也是窗口重要的一部分。窗口狀態欄是指位于窗口左下角處用于對窗口狀態欄進行操作，分別是status屬性和defaultStadus屬性 Status屬性和defaultStatus屬性值都是一個字符串，defaultStatus屬性值表示在默認情況下窗口狀態欄中顯示的內容，status屬性值表示當某一指定事件發生時，窗口狀態欄中顯示的內容。ppt課件.463.5 窗口狀態欄代碼：窗口狀態欄窗口狀態欄精通合計ppt課件.47第四章 定時設置 定時設置也是一種對窗口的操作，但由于它有點難懂而且非常重要，所以這里來著重講解下定時設置。在javascript中，為window對象定義了四種方法來進

24、行定時設置。使用setInterval方法和clearInterval方法來設置和取消循環定時操作。使用setTimeout方法和clearTimeout方法來設置和取消延時定時操作ppt課件.484.1 循環定時 Javascript中，是用setInterval方法和clearInterval方法來進行循環定時操作。clearInterval方法用來取消循環定時操作，它的使用很簡單，其基本形式為： clearInterval(interval); clearInterval方法有一個參數，該參數是指值setInterval方法的返回值的變量。 setInterval方法是用來設置循環定時操

25、作，它的使用要比clearInterval方法要復雜的多，而且有兩種基本形式。其基本形式為： seInterval(expression,milliseconds); setInterval(function,milliseconds,funcarg1.funcargn); 在setInterval方法的第一種形式中，第一個參數是一個字符串，它表示需要循環執行的函數或表達式，如果是函數則不允許出現自變量。第二個參數是一個毫秒值，表示每經過該毫秒就循環執行一次函數或者表達式。第二種形式中的第三個參數表示函數需要的參數。ppt課件.494.2 延時設定延時定時和循環定時很相似，在javascrip

26、t中，使用setTimeout方法和clearTimeout方法來進行延時定時操作。clearTimeout方法用來取消延時定時操作，他的使用很簡單，其基本形式為： clearTimeout（interval）；clearTimeout方法中有一個參數，該參數是指值為setTimeout方法返回的變量。setTimeout方法是用來設置延時定時操作，他的使用要比clearTimeout方法的使用復雜的多，而且有兩種基本形式。其基本形式為： setTimeout(expression,milliseconds); setTimeout(function,millisecond,funcarg1.

27、funcargn);在setTimeout方法的第一種形式中，第一個參數是一個字符串，它表示需要延時執行的函數或表達式，如果是函數則不允許出現自變量。第二個參數是一個毫秒值，表示經過該毫秒就延時執行函數或者表達式，而且是只執行一次。第二種形式中的第三個參數表示函數需要的參數。ppt課件.503.5 窗口事件 事件是javascript中一個重要的內容，但由于窗口事件很簡單且非常容易理解，因此在本章中，就來對窗口事件進行一些簡單的了解。窗口事件和瀏覽器有很大的關系，這里要講解在各個瀏覽器中通用的事件。ppt課件.515.1 文檔載入事件 文檔載入事件就是onload事件。當文旦那個加載完成后，也

28、就是網頁中的所有內容都從服務器下載到瀏覽器后，觸發該事件。Onload事件在實際應用中非常有用，應用該事件能保證在文檔完全加載后在進行其他操作。該事件不是有人為觸發的，而是當文檔加載完成后自動觸發的。ppt課件.525.1 文檔載入事件代碼：文檔加載事件文檔載入事件ppt課件.535.1 文檔載入事件 在上一個程序中使用的window對象來調用文檔載入事件。除了使用這種方法調用事件外，還可以將事件寫在bodu標記中，下面就是對上個程序進行改動的代碼。 在使用window對象來觸發onload事件時，如果觸發的事件是一個函數，則只需要函數名，不需要后面的括號；但是在標記中使用onload事件時，除了需要函數名外，還需要后面的括號。ppt課件.545.1 文檔載入事件代碼2：文檔加載事件文檔載入事件ppt課件.555.2 關閉窗口事件 對于當前的知識面而言，onunload事件就是關閉窗口事件，在學到更多知識后，他還可以表示其他的一些事件。Onunload事件也是非常有用的，當向服務器提交信息時，用戶可能會關閉窗口，為了能保證提交成功，就可以將提交的操作寫在onunload事件中。但是在實際開發中并不是這樣操作，一般用于告知用戶不要關閉窗口。 Onunload事件和onload事件一樣，也可以放在body標記中。ppt課件.565.2 關閉窗口事件代碼：關閉窗口事件關閉窗口事件ppt