ホームページ > 記事 > ウェブフロントエンド > JavaScriptのJSウィンドウを詳しく解説＜2＞

JavaScriptのJSウィンドウを詳しく解説＜2＞

黄舟オリジナル: 2017-02-27 14:47:551542ブラウズ

質問? JavaScript における JS ウィンドウの詳細な説明2cc198a1d5eb0d3eb508d858c9f5cbdb

定義: JavaScript ウィンドウ - ブラウザオブジェクトモデル
ブラウザオブジェクトモデル (BOM)
ブラウザオブジェクトモデル (ブラウザオブジェクトモデル) には正式な標準はありません。
最近のブラウザでは JavaScript の対話性のために (ほぼ) 同じメソッドとプロパティが実装されているため、メソッドとプロパティは BOM とみなされます。

1.Window オブジェクト
すべてのブラウザが window オブジェクトをサポートしています。ブラウザウィンドウを表します。
すべての JavaScript グローバルオブジェクト、関数、変数は自動的に window オブジェクトのメンバーになります。
グローバル変数はウィンドウオブジェクトのプロパティです。
グローバル関数はウィンドウオブジェクトのメソッドです。
HTML DOM のドキュメントもウィンドウオブジェクトのプロパティの 1 つです:

window.document.getElementById("header");

これと同じ:

document.getElementById("header");

2.ウィンドウサイズ
ブラウザのサイズを決定するには 3 つの方法がありますウィンドウ (ツールバーとスクロールバーを除く、ブラウザのビューポート)。

Internet Explorer、Chrome、Firefox、Opera、Safari の場合:

window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度

Internet Explorer 8、7、6、5 の場合:

document.documentElement.clientHeight
document.documentElement.clientWidth

または

これはボディの長さと幅を取得するためのものです

document.body.clientHeight
document.body.clientWidth

例えば:

	var w = window.innerWidth;
	var h = window.innerHeight;
	/*这个获取的长宽与下列的相同*/
	var w2 = document.documentElement.clientWidth;
	var h2 = document.documentElement.clientHeight;
	/*这得到的是body的长度*/
	var h1 = document.body.clientHeight;
	var w1 = document.body.clientWidth;
	document.getElementById("a1").innerHTML="内部窗口大小为："+w+"*"+h+"   "+w1+"*"+h1+"  "+w2+"*"+h2;

3.メソッド

その他のメソッド:
window.open( ) - 新しいウィンドウを開きます

の例:

window.open(&#39;1.html&#39;,&#39;ss&#39;);
window.close() - 关闭当前窗口window.moveTo() - 移动当前窗口window.resizeTo() - 调整当前窗口的尺寸

の例:

window.resizeTo(600,600);

4.localtion

window.location オブジェクトは、現在のページのアドレス (URL) を入力し、ブラウザーが新しいページにリダイレクトします。

Window Location
window.location オブジェクトは、window プレフィックスを使用せずに記述することができます。
いくつかの例:

location.hostname 返回 web 主机的域名
location.pathname 返回当前页面的路径和文件名
location.port 返回 web 主机的端口 （80 或 443）
location.protocol 返回所使用的 web 协议（http:// 或 https://）

document.getElementById("a2").innerHTML="主机名"+location.hostname+" 
 路径:"+location.pathname+" 端口号:"+location.port+"  web协议:"+location.protocol;

5.Window Location Assign

location.assign() メソッドは、新しいドキュメントを読み込みます。

例:

document.getElementById("a2").innerHTML="主机名"+location.hostname+"  
路径:"+location.pathname+" 端口号:"+location.port+"  web协议:"+location.protocol+" IRL:"+location.href;

6.ウィンドウ履歴

window.historyオブジェクトは、ウィンドウプレフィックスを使用せずに記述することができます。

ユーザーのプライバシーを保護するために、JavaScript によるこのオブジェクトへのアクセス方法には制限が設けられています。いくつかのメソッド: history.back() - ブラウザの「戻る」ボタンをクリックするのと同じ

history.forward() - ブラウザの「進む」ボタンをクリックするのと同じ

7.window.navigatorオブジェクトには、訪問者のブラウザに関する情報が含まれています。

Window Navigator

window.navigator オブジェクトは、window プレフィックスを使用せずに記述することができます。例

window.location.assign("http://www.w3school.com.cn");
window.location.assign("1.html");

警告: ナビゲーターオブジェクトからの情報は誤解を招くため、ブラウザのバージョンの検出には使用しないでください。理由は次のとおりです: ナビゲーターデータはブラウザユーザーによって変更される可能性があります

ブラウザは新しいオペレーティングシステムがリリースされたことを報告できませんブラウザで

8. メッセージボックス:

アラートボックス: balert("Hello again! Here we show you" + 'n' + " アラートに改行を追加する方法ボックス」)

。

确认框: var r=confirm("Press a button!") 这里的r值，点击确认为true，否则为false

提示框： var name=prompt("请输入您的名字","Bill Gates")前者是提示信息，后者是默认值，name是输入框的返回值

二、JavaScript 计时

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

JavaScript 计时事件
通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。
在 JavaScritp 中使用计时事件是很容易的，两个关键方法是:
setTimeout()
未来的某时执行代码
clearTimeout()
取消setTimeout()

语法：var t=setTimeout("javascript语句",毫秒)

setTimeout("alert(&#39;5seconds message!&#39;)",5000);//5秒后执行

三、Cookie

什么是cookie?
cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。

有关cookie的例子：
名字 cookie
当访问者首次访问页面时，他或她也许会填写他/她们的名字。名字会存储于 cookie 中。当访问者再次访问网站时，他们会收到类似 "Welcome John Doe!" 的欢迎词。而名字则是从 cookie 中取回的。

密码 cookie
当访问者首次访问页面时，他或她也许会填写他/她们的密码。密码也可被存储于 cookie 中。当他们再次访问网站时，密码就会从 cookie 中取回。

日期 cookie
当访问者首次访问你的网站时，当前的日期可存储于 cookie 中。当他们再次访问网站时，他们会收到类似这样的一条消息："Your last visit was on Tuesday August 11, 2005!"。日期也是从 cookie 中取回的。

<html>
<head>
<script type="text/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(&#39;username&#39;)
if (username!=null && username!="")
  {alert(&#39;Welcome again &#39;+username+&#39;!&#39;)}
else 
  {
  username=prompt(&#39;Please enter your name:&#39;,"")
  if (username!=null && username!="")
    {
    setCookie(&#39;username&#39;,username,365)
    }
  }
}
</script>
</head>

<body onLoad="checkCookie()">
</body>
</html>

以上就是JavaScript之JS Window详解77d226c7a2080f1d99ea5951bd228e92 的内容，更多相关内容请关注PHP中文网（www.php.cn）！

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：JavaScriptの詳しい解説<1>次の記事：JavaScriptの詳しい解説<1>

続きを見る

JavaScriptのJSウィンドウを詳しく解説＜2＞

関連記事