onload、window.open、同一生成元ポリシー、履歴オブジェクト、場所オブジェクト、ナビゲーターオブジェクト

1.ロード

window.onload CSSやページ画像を含むすべてのページ読み込みイベントが、このイベントをトリガーします。
window.addEventListener( "DOMContentLoaded"、function(){})は、DOMツリー構造がロードされるとすぐにトリガーされます。これはより高速です。

2.window.open()/ window.close()

 var windowObjectReference =  window.open(strURL,[strWindowName], [strWindowFeatures]);
                                           地址,     页面名 ,        样式(如宽高的设定)

windowObjectReference:新しいページのウィンドウオブジェクトを表すopenメソッドの呼び出しの戻り値

同一生成元:プロトコル/ホスト/ポート番号はまったく同じです

他のウィンドウメソッドは、同一生成元ポリシーの下で呼び出すことができます

以下は、http://www.a.com/test/index.html•http:
//www.a.com/dir/page.htmlに関連する同一生成元の検出です----成功
•http:/ / www .child.a.com / test / index.html ----失敗した、異なるドメイン名
•https://www.a.com/test/index.html ----失敗した、異なるプロトコル
•http: // www .a.com:8080 / test / index.html ----失敗しました、ポート番号が異なります

URL:ネットワーク上の特定のリソースのアドレスを表すUniform ResourceLocator

  protocol:    //host[:port]/path/[?query]#fragment
        协议:  http :80  /https  :443
        host:  ip 地址  ->  域名 -> 子域名(服务器名 www  mail)+主域名
                 本地打开服务 127.0.0.1 本机ip地址   localhost
                 局域网  192.160.0.100
                 无线网  192.168.43.90
         port: 端口号
         path: 文件地址
        query: 参数 以 ? 键值对的形式表示,多个键值对通过 & 符号分隔  ?name=zhangsan&age=12
     fragment: 片段  # 后面的内容,常见于链接,锚点

3.履歴オブジェクト

historyは、現在のページジャンプ履歴を記録し、数と方向のみを記録でき、アドレスを記憶できません
。history.lengthは、生成されたレコードスタックの長さを記録します
。history.go(n)nは、順方向または逆方向のジャンプの数を表します
。 ()前のページに移動go(1)
history.back()ページに戻るgo(-1)

4.ロケーションオブジェクト

location.search()クエリパラメータ

特定へジャンプ
page-window.open(URL)
-location.href = URL
-location.assign(URL)
-location = URL
-location.replace(URL)跡を残さずに

中国語の場所の伝記

// decodeURI  把 encodeURI 编码转回去

var string = decodeURI(location.search);

 ?name=%E6%9D%8E%E7%99%BD&age=12
 >>>
  ?name=李白&age=12

ナビゲーターオブジェクト

navigator.userAgentは、ブラウザー環境を区別します(通常と組み合わせて)

    console.log(navigator.userAgent);
Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36
var browserName = navigator.userAgent.toLowerCase(); 
//区分手机端还是PC端
isMobile = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(browserName));
//判断浏览器
isFirefox = /firefox/i.test(browserName);
isChrome = /chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName);

if(isChrome){
    
    
    alert("chrome浏览器");
}
if(isFirefox){
    
    
    alert("火狐浏览器");
}

if(isMobile){
    
    
    alert("移动端");
}

// 监听联网
window.ononline = function (){
    
    
    console.log(navigator.onLine); // true
}
window.onoffline = function (){
    
    
    console.log(navigator.onLine); // false
}

おすすめ

転載: blog.csdn.net/weixin_47067248/article/details/107867340