Javascript学習ノート(13)--windowブラウザの対象モデル

4600 ワード
機能:JavaScriptにブラウザとの「対話」能力を持たせる
すべてのブラウザはwindowオブジェクトをサポートします.ブラウザのウィンドウを表します.すべてのJavaScriptグローバルオブジェクト、関数、変数は自動的にwindowオブジェクトのメンバーになります.グローバル変数はwindowオブジェクトの属性です.グローバル関数はwindowオブジェクトの方法です.HTML DOMのdocumentもwindowオブジェクトの属性の一つです.window.document.getElementById("header");はこれと同じです.document.getElementById("header");他のwindow方法:window.open()-新しいウィンドウを開くwindow.close()-現在のウィンドウを閉じるwindow.moveTo()-現在のウィンドウを移動しますwindow.resizett()-現在のウィンドウのサイズを調整します.
1.window screem
window.screenオブジェクトは、ユーザ画面に関する情報を含む.window.screenオブジェクトは、作成時にwindowというプレフィックスを使わなくてもいいです.いくつかのプロパティ:screen.avail Width-利用可能な画面幅screen.availHeight-利用可能な画面高さ
2.window location
一部の属性locations.href属性は現在のページのURLを返します.結果出力:http://www.w3school.com.cn/js/js_window_location.asplocation.hostnameはウェブホストのドメイン名に戻ります.
location.pathnameは現在のページのパスとファイル名の結果を返します.出力は/js/js_window_location.aspです.
location.portは、ウェブホストのポートに戻る(80または443)
location.protocolは、使用するウェブプロトコル(http:/またはhttps:/)を返します.
location.assign()メソッドは、新しいドキュメントを読み込みます.
3.windows history
history.back()-ブラウザで後退ボタンをクリックするのと同じhistory.forward()-ブラウザでボタンを押して前に進むのと同じです.
4.Window Navigator
window.navigatorオブジェクトには訪問者ブラウザに関する情報が含まれています.たとえば:


txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
txt+= "<p>User-agent language: " + navigator.systemLanguage + "</p>";
document.getElementById("example").innerHTML=txt;

5. 消息框

可以在 JavaScript 中创建三种消息框：警告框、确认框、提示框。

  1. 警告框alert
    当警告框出现后，用户需要点击确定按钮才能继续进行操作。
    alert("text")
  2. 确认框confirm
    确认框用于使用户可以验证或者接受某些信息。
    当确认框出现后，用户需要点击确定或者取消按钮才能继续进行操作。
    如果用户点击确认，那么返回值为 true。如果用户点击取消，那么返回值为 false。
    confirm("文本")
  3. 提示框
    提示框经常用于提示用户在进入页面前输入某个值。
    当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。
    如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null。
    prompt("文本","默认值")

6. 计时

通过使用 JavaScript，我们有能力做到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。

  1. setTimeout()
    语法
    var t=setTimeout("javascript ", )
    例1：


function timedMsg()
 {
 var t=setTimeout("alert('5 seconds!')",5000)
 }
例2:無限ループ


var c=0
var t
function timedCount()
 {
 document.getElementById('txt').value=c
 c=c+1
 t=setTimeout("timedCount()",1000)   #    
 }
  • clearTimeout()setTimeoutをキャンセルする文法:clearTimeout(setTimeout_variable)
    • 7.cookies
    役割:顧客を識別するために何がクッキーですか?クッキーは訪問者のコンピュータに格納された変数です.同じコンピュータがブラウザを通してあるページを要求するたびに、このクッキーを送ります.JavaScriptを使ってクッキーの値を作成し、取り戻すことができます.
  • は、クッキー変数に訪問者の名前を格納できる関数を作成します.
  • は、クッキーが設定されているかどうかを確認するための別の関数を作成します.
  • クッキーが設定されている場合、歓迎語が表示され、そうでなければ、ユーザに名前の入力を要求するためにプロンプトボックスが表示される.コードは以下の通りです.
    • 


function getCookie(c_name)
{
if (document.cookie.length>0)
  {
  c_start=document.cookie.indexOf(c_name + "=")
  if (c_start!=-1)
    { 
    c_start=c_start + c_name.length+1 
    c_end=document.cookie.indexOf(";",c_start)
    if (c_end==-1) c_end=document.cookie.length
    return unescape(document.cookie.substring(c_start,c_end))
    } 
  }
return ""
}
function setCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}
function checkCookie()
{
username=getCookie('username')
if (username!=null && username!="")
  {alert('Welcome again '+username+'!')}
else 
  {
  username=prompt('Please enter your name:',"")
  if (username!=null && username!="")
    {
    setCookie('username',username,365)
    }
  }
}
    Javascript class