フロントエンドフィールドにおけるWindowオブジェクトの役割-jsチュートリアル-php.cn

フロントエンドフィールドにおけるWindowオブジェクトの役割

青灯夜游

リリース： 2019-11-26 17:24:47

転載

1819 人が閲覧しました

特別ウィンドウ

Web ページ上のメンションウィンドウこれは、次のような非常に一般的なものです。

window.onload=function(){
//执行函数体
}

ログイン後にコピー

このコードは、Web ページのコンテンツが読み込まれたときに何を行うかを意味します。

js の分野では、ウィンドウオブジェクトはブラウザウィンドウにアクセスするためのインターフェイスとグローバルオブジェクトの 2 つの役割を持っています。 [関連コースの推奨事項:

JavaScript ビデオチュートリアル ]

このため、グローバルスコープで宣言されたすべての変数と関数は、ウィンドウオブジェクトのプロパティとメソッドになります。

例:

var age = 29;
function sayAge(){
    alert(this.age);
}
alert(window.age); //29
sayAge();         //29
window.sayAge();  //29

ログイン後にコピー

ただし、これら 2 つは完全に同等ではありません。グローバル変数は削除によって削除できませんが、ウィンドウ上で直接定義されたプロパティは削除できます。

歴史的遺産

初期の Web ページでは、より多くのウィンドウとフレームが使用され、同じウィンドウにインレイが表示されていました。 Web ページのセット、アラート、確認、プロンプトなどのさまざまなポップアップウィンドウを使用して、ユーザーは情報を入力または確認できますが、Web 開発技術とデザインの発展に伴い、それらは見つけるのが困難になっているため、ここではそれらに焦点を当てないでください。

#location オブジェクト

基本属性

Location は、最も便利な BOM オブジェクトの 1 つです。現在のウィンドウにロードされているドキュメントの情報とナビゲーション機能を提供します。その主な用途は URL に関連しています。

ハッシュ: URL 内の # 記号の後の文字を返します。そうでない場合は空を返します。

● host/hostname: サーバー名またはポート番号を返します。

● href: 完全な URL を返します

● Port: 指定されたポート番号を返します

● Protocol: 使用されているプロトコルを返します

Search: を返しますURL クエリ文字列、つまり疑問符の最初から最後までのすべて

#Location 操作

Location はさまざまな方法でブラウザの場所を変更できます。最も一般的に使用されるのは assign() メソッドです。例:

location.assign("http://www.baidu.com");

ログイン後にコピー

これにより、すぐに新しい URL が開き、閲覧履歴にレコードが追加されます。次の 2 行のコードは同等です:

window.location = "http://www.baidu.com";
location.href = "http://www.baidu.com";

ログイン後にコピー

最も一般的なのは location .href です。

もちろん、他の属性を変更すると、現在ロードされているページも変更できます。何らかの方法で URL を変更すると、新しいレコードが生成されます。ユーザーは、「戻る」ボタンをクリックして前のページに移動できます。この操作を実行したくない場合は、replace() メソッドを使用できます。次のようなものです:

location.replace("http://www.baidu.com");

ログイン後にコピー

これは、移動先の URL という 1 つのパラメーターのみを受け取ります。レコードは生成されず、ユーザーは前のページに戻ることはできません。

もう 1 つの位置関連のメソッドは reload() です。これは文字通り現在のページを再読み込みすることを意味しますが、ここで少し注意点があります。パラメータを指定せずに再読み込みするだけの場合、ページはブラウザキャッシュからの再読み込みから開始されます。サーバーから強制的にリロードする場合は、次のようなパラメータを渡す必要があります:

location.reload(true);

ログイン後にコピー

history オブジェクト

history の記録を保持します。インターネットをサーフィンしているユーザー。各ブラウザウィンドウとタブには、特定のウィンドウオブジェクトに関連付けられた独自の履歴オブジェクトがあります。セキュリティ上の理由から、開発者は通常、ユーザーがどの Web ページを閲覧したかを知ることはできませんが、順方向と逆方向の両方を実装する方法はまだあります。関数は go() です。例:

history.go(-1);
history.go(1);

ログイン後にコピー

パラメータは数値だけでなく文字列でもあり、ブラウザはその文字列を含む履歴内の最初の位置に前方または後方にジャンプします。たとえば、

history.go("baidu.com");

ログイン後にコピー

さらに、前方または後方に移動するための、より直接的なメソッド back() および forward() があります。

さらに、履歴には履歴レコードの数を保存する長さ属性もあり、ユーザーがページを最初から開いたかどうかを確認したい場合に使用できます。

if(history.length == 0){
    //干你想干的事
}

ログイン後にコピー

履歴オブジェクトは特に一般的に使用されるわけではありませんが、一部の特殊用途の設計では、問題を解決するために依然としてオブジェクトを要求する必要があります。

概要

モバイルインターネットウェーブにおけるウィンドウオブジェクトのステータスは、PC 側のステータスほど重要ではなくなりました。より多くの機能と検出が含まれるある側面では、より多くの対話が関係しますが、他の側面は、より豊富な機能を備えたカスタムコードによって実装されます。

そうは言っても、ウィンドウオブジェクトは単純なだけではなく、重要なナビゲーターオブジェクトもありますが、これに関しては内容が非常に多く、また別の記事で紹介します。後で。

この記事は

js チュートリアル

列からのものです。ぜひ学習してください。

以上がフロントエンドフィールドにおけるWindowオブジェクトの役割の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。