10.BOM:location對象(案例:5秒鐘自動跳轉(zhuǎn)頁面鲸睛、獲取URL參數(shù))、location對象的常見方法坡贺、navigator對象官辈、history對象

location對象

什么是 location 對象

URL


location 對象的屬性


案例:5秒鐘自動跳轉(zhuǎn)頁面

    <button>點(diǎn)擊</button>
    <div></div>
    <script>
        var btn = document.querySelector('button');
        var div = document.querySelector('div');
        btn.addEventListener('click', function() {
            // console.log(location.href);
            location.href = '網(wǎng)頁地址';
        })
        var timer = 5;
        setInterval(function() {
            if (timer == 0) {
                location.href = '網(wǎng)頁地址';
            } else {
                div.innerHTML = '您將在' + timer + '秒鐘之后跳轉(zhuǎn)到首頁';
                timer--;
            }
        }, 1000);
    </script>

案例:獲取URL參數(shù)

第一個頁面

<body>
    <form action="index.html">
        用戶名: <input type="text" name="uname">
        <input type="submit" value="登錄">
    </form>
</body>

第二個頁面index.html

<body>
    <div></div>
    <script>
        console.log(location.search); // ?uname=andy
        // 1.先去掉?  substr('起始的位置'遍坟,截取幾個字符);
        var params = location.search.substr(1); // uname=andy
        console.log(params);
        // 2. 利用=把字符串分割為數(shù)組 split('=');
        var arr = params.split('=');
        console.log(arr); // ["uname", "第一個頁面的輸入內(nèi)容"]
        var div = document.querySelector('div');
        // 3.把數(shù)據(jù)寫入div中
        div.innerHTML = arr[1] + '歡迎您';
    </script>
</body>

location對象的常見方法

    <button>點(diǎn)擊</button>
    <script>
        var btn = document.querySelector('button');
        btn.addEventListener('click', function() {
            // 記錄瀏覽歷史拳亿,所以可以實(shí)現(xiàn)后退功能
            // location.assign('網(wǎng)頁地址');
            // 不記錄瀏覽歷史,所以不可以實(shí)現(xiàn)后退功能
            // location.replace('網(wǎng)頁地址 ');
            //強(qiáng)制刷新(true)
            location.reload(true);
        })
    </script>

navigator對象

? navigator 對象包含有關(guān)瀏覽器的信息愿伴,它有很多屬性肺魁,我們最常用的是 userAgent,該屬性可以返回由客戶機(jī)發(fā)送服務(wù)器的 user-agent 頭部的值隔节。

下面前端代碼可以判斷用戶那個終端打開頁面鹅经,實(shí)現(xiàn)跳轉(zhuǎn)

if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
    window.location.href = "";     //手機(jī)
 } else {
    window.location.href = "";     //電腦
 }

history對象

? window對象給我們提供了一個 history對象寂呛,與瀏覽器歷史記錄進(jìn)行交互。該對象包含用戶(在瀏覽器窗口中)訪問過的URL瘾晃。

history對象一般在實(shí)際開發(fā)中比較少用贷痪,但是會在一些 OA 辦公系統(tǒng)中見到。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末酗捌,一起剝皮案震驚了整個濱河市呢诬,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌胖缤,老刑警劉巖尚镰,帶你破解...
    沈念sama閱讀 219,110評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異哪廓,居然都是意外死亡狗唉,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,443評論 3 395
  • 文/潘曉璐 我一進(jìn)店門涡真,熙熙樓的掌柜王于貴愁眉苦臉地迎上來分俯,“玉大人,你說我怎么就攤上這事哆料「准簦” “怎么了?”我有些...
    開封第一講書人閱讀 165,474評論 0 356
  • 文/不壞的土叔 我叫張陵东亦,是天一觀的道長杏节。 經(jīng)常有香客問我,道長典阵,這世上最難降的妖魔是什么奋渔? 我笑而不...
    開封第一講書人閱讀 58,881評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮壮啊,結(jié)果婚禮上嫉鲸,老公的妹妹穿的比我還像新娘。我一直安慰自己歹啼,他們只是感情好玄渗,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,902評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著狸眼,像睡著了一般藤树。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上份企,一...
    開封第一講書人閱讀 51,698評論 1 305
  • 那天也榄,我揣著相機(jī)與錄音巡莹,去河邊找鬼司志。 笑死甜紫,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的骂远。 我是一名探鬼主播囚霸,決...
    沈念sama閱讀 40,418評論 3 419
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼激才!你這毒婦竟也來了拓型?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,332評論 0 276
  • 序言:老撾萬榮一對情侶失蹤瘸恼,失蹤者是張志新(化名)和其女友劉穎劣挫,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體东帅,經(jīng)...
    沈念sama閱讀 45,796評論 1 316
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡压固,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,968評論 3 337
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了靠闭。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片帐我。...
    茶點(diǎn)故事閱讀 40,110評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖愧膀,靈堂內(nèi)的尸體忽然破棺而出拦键,到底是詐尸還是另有隱情,我是刑警寧澤檩淋,帶...
    沈念sama閱讀 35,792評論 5 346
  • 正文 年R本政府宣布芬为,位于F島的核電站,受9級特大地震影響狼钮,放射性物質(zhì)發(fā)生泄漏碳柱。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,455評論 3 331
  • 文/蒙蒙 一熬芜、第九天 我趴在偏房一處隱蔽的房頂上張望莲镣。 院中可真熱鬧,春花似錦涎拉、人聲如沸瑞侮。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,003評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽半火。三九已至,卻和暖如春季俩,著一層夾襖步出監(jiān)牢的瞬間钮糖,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,130評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留店归,地道東北人阎抒。 一個月前我還...
    沈念sama閱讀 48,348評論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像消痛,于是被迫代替她去往敵國和親且叁。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,047評論 2 355