1. 程式人生 > 實用技巧 >JavaScript-核心物件--瀏覽器物件

JavaScript-核心物件--瀏覽器物件

JavaScript-核心物件

  JavaScript核心物件是將一些非常有用的功能預先定義成物件與函式,在JavaScript語言中可以直接施一公。例如window.document.forms[0],表示引用文件中的第一個表單。

1.瀏覽器物件

  瀏覽器物件是網頁和瀏覽器本身的各種元素在JavaScript程式中的體現,它使JavaScript可以定位,改變以及展示HTML頁面的所有元素。JavaScript可以訪問瀏覽器提供的物件,通過對這些物件的訪問,可以得到當前網頁以及瀏覽器本身的一些資訊,甭能萬層有關的操作。

2.window物件

  window 物件是瀏覽器各物件的祖先,處於所有物件的最頂層,這並不是一種繼承關係,而是從屬關係,及所有瀏覽器物件是windiw物件的屬性,可以通過window物件訪問瀏覽器物件,每一個window物件代表一個瀏覽器視窗。在訪問瀏覽器物件時window可以省略,

  訪問方法

window.子物件1. 子物件2.屬性名或方法名。
如
window.document.login.username.value="guest";
或
document.login.username.value='guest';

  1.window物件的屬性

  Status:設定瀏覽器狀態行中所顯示的資訊。

        <script language="JavaScript"> (windowstatus.htm)
        window.status="歡迎訪問光臨本站!";
        </script>

  2.window物件的方法

    <script type="text/JavaScript">

        name="";
        name = window.prompt("請輸入您的姓名:",name);
        window.alert(name  "您好!開始考試!");
        if (window.confirm(你準擺好了嗎?)){
            window.location.herf="exam.jsp";
        };
    </script>
①.open(“url”,["window name"[,"window feature"]])

功能:開啟一個新的視窗

引數說明:

  url:要開啟視窗的url地址

  window name :是新開啟視窗的名稱

  window deatures: 是新視窗的實際特性(視窗的外觀)可選項的可能引數

  height:視窗的高度

  weight:視窗的寬度

  menubar:是否有選單

  scrollbars:是否有滾動條

  resizable:視窗大小是否可以改變

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/JavaScript">
        function openwin(url) {
        var newwin = window.open(url,"winname","toolbar=no,directories = no,menubar=no,
        scrollbars=yes,rdsizable=no,width=500,height=360");
        newwin.focus();
        return(newwin);
        }

    </script>
</head>
<body>
    <a href="#" onclick="javaScript:openwin('myintro.jsp.jsp')">作者簡介</a>
    
</body>
②.close方法

使用方法:

視窗物件.close()

關閉指定的盧蘭其視窗

3.location物件

  location物件包含當前網頁的URL.該物件有一個常用的href屬性和reload()方法,其作用是導航到指定的網頁

  href屬性:用於指定導航到的網頁,作用等價於<a>標籤的功能

可以使用下面的程式碼將當前頁面切換到test.html

<a href=# onclick="JavaScript:window.location.href='test.html>按此處 到下一個頁面</a>

  reload()方法:實現當前網頁的重新裝載。

  若要重新裝載當前頁面

window.location.reload();window.location.reload();

4.history物件

  history物件包含有最近10各網頁的url地址,他有一個length屬性,可以返回當前有多少個url儲存在history物件中共。該物件提供的got(數值)方法,可以實現網頁的導航,可以讓瀏覽器前進或後退到已經訪問過的某個頁面。數值為負數往後回退到曾訪問過的倒數第幾個頁面。數值為整數表示前進到曾訪問過的第幾個頁面。

window.history.go(-1)    後退到曾訪問過的倒數第一個頁面
window.history.go(-2) 後退到曾訪問過的倒數第二個頁面
window.history.go(2) 後退到曾訪問過的第二個頁面
window.history.go(0) 重新裝在當前頁面

5.screen物件

  screen物件通過屬性設定當前使用者的螢幕,

屬性:

  width(height):指定或返回螢幕的可用寬度(高度)(畫素數)

  availWidth(availHeight):指定或返回螢幕的可用寬度(高度)(一些不自動因殘的類似工作列的東西所佔用的寬度(高度)不計算在內)

  colorDepth:指定或返回當前顏色設定所用的位數-1:黑白;8:256 色;16:增強色;24/32:真彩色;

  screenTop(screenLeft):螢幕頂端(左端)離本活動視窗中正文的頂端(左端)的距離,隨視窗顯示在螢幕上的位置而改變

  offsetWidth(offsetHeight):是物件可見的寬度(高度),包滾動條等邊線,會隨視窗的顯示大小改變

  clientWidh(clientHeight):是物件可見的寬度(高度),不包滾動條等邊線,會隨視窗的顯示大小改變

  scrollWidth(scorllHeight):是物件實際內容的寬度(高度),不包邊線寬度(高度),會隨物件中內容的多少改變(內容多了可能會改變物件的事件寬度)

document.write("螢幕的寬度:"+screen.Width+"<br>")
document.write("螢幕的高度:"+screen.Height+"<br>")