第5回JavaScriptゼミ

第7回JavaScriptゼミ
セクション4-5
発表者
直江 宗紀
locationオブジェクト

locationオブジェクトとは




現在のページのURLの情報管理するオブジェクト
指定ページへのジャンプ、別ウィンドウURL変更も可
メソッドによるページ移動、リロードなども行う
URLとは


Uniform Resource Locatorの略
構造:
プロトコル://ホスト名:ホスト名/パス名#アンカー名?検索文字列
例:http://www.google.com/ig?hl=ja.
locationオブジェクト(2)

locationオブジェクトのプ
ロパティ


WebページのURL全体ま
たは一部を表す
現在のWebページのURL
に存在しないプロパティ
→””が返される
プロパティ
説明
hash
URLのアンカー部分
host
URLのホストネーム+ポー
ト番号
href
URLすべて
hostname URLのホスト名
pathname URLのパス名
port
URLのポート番号
protocol
URLプロトコル部分
search
URL検索キーワードなどを
指定する部分
プロパティの特徴

特徴

プロパティは読み込み書き込み可能
例:window.location.href=“http://www.yahoo.co.jp/” ;


locationオブジェクトに直接URL指定可脳
例:window.location=“http://www.google.com/”;
locationオブジェクトのメソッド

locationオブジェクトのメソッドについて

reload()


現在のドキュメントを強制リロード
引数が



trueの場合:サーバーからロード
falseの場合:キャッシュからロード
replace()



現在のWebページを削除→指定ページをロード
引数は指定先URL
利用時、履歴も削除される
メソッド利用プログラム例
自動ページ移動プログラム
<html>
<head>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script language="JavaScript" type="text/javascript">
var time=5 ;
function setTimer(){
setTimeout("location.replace('timeout.html')",time*1000) ;
}
</script>
</head>
<body bgcolor="#ffffff" onload="setTimer()">
<h2>5秒後に自動ページ移動</h2>
</body>
</html>
プログラム結果
historyオブジェクト

historyオブジェクトとは



これまで開いたWebページを記録
(ただし、ブラウザ起動後から)
開いた記録から「戻る」や「進む」の機能を提供
(ブラウザと違い任意のページ数移動できる)
historyオブジェクトのプロパティ


lengthのみ
これまで開いたページ数が格納されている
historyオブジェクトのメソッド

historyオブジェクトのメソッドについて

back()



forward()



履歴を1つさかのぼる
構文:history.back()
履歴を1つ新しい方に移動する
構文:history.forward()
go()


引数に指定した数値分のページを戻したり進ませる
history.go(pageNumber)
go()メソッド

go()メソッドについて


引数:pageNumber – 戻る、進むページ数
正数ー進むページ数
負数ー戻るページ数
0 -現在のページをリロード
練習問題

任意のページのソースを表示するプログラムを
作成せよ。なお、その際参考書のサンプルプロ
グラムを参考にしても良い(p.271 – viewsrc.html)。