JS-Location對(duì)象/Navigator對(duì)象/userAgent/screen對(duì)象/屏幕分辨率的高和寬/屏幕可用高和寬度/編程練習(xí)

Location對(duì)象

location用于獲取或設(shè)置窗體的URL钉凌,并且可以用于解析URL。

語(yǔ)法:

location.[屬性|方法]

location對(duì)象屬性圖示:


location 對(duì)象屬性

location 對(duì)象屬性:


image.png

location 對(duì)象方法:
image.png

Navigator對(duì)象

Navigator 對(duì)象包含有關(guān)瀏覽器的信息滥搭,通常用于檢測(cè)瀏覽器與操作系統(tǒng)的版本。
對(duì)象屬性:


image.png

查看瀏覽器的名稱(chēng)和版本闽坡,代碼如下:

<script type="text/javascript">
   var browser=navigator.appName;
   var b_version=navigator.appVersion;
   document.write("Browser name"+browser);
   document.write("<br>");
   document.write("Browser version"+b_version);
</script>

userAgent

返回用戶(hù)代理頭的字符串表示(就是包括瀏覽器版本信息等的字符串)

語(yǔ)法

navigator.userAgent

幾種瀏覽的user_agent.愁溜,像360的兼容模式用的是IE、極速模式用的是chrom的內(nèi)核代承。


image.png

使用userAgent判斷使用的是什么瀏覽器(假設(shè)使用的是IE8瀏覽器),代碼如下:

function validB(){ 
  var u_agent = navigator.userAgent; 
  var B_name="Failed to identify the browser"; 
  if(u_agent.indexOf("Firefox")>-1){ 
      B_name="Firefox"; 
  }else if(u_agent.indexOf("Chrome")>-1){ 
      B_name="Chrome"; 
  }else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){ 
      B_name="IE(8-10)";  
  }
    document.write("B_name:"+B_name+"<br>");
    document.write("u_agent:"+u_agent+"<br>"); 
} 
image.png

screen對(duì)象

screen對(duì)象用于獲取用戶(hù)的屏幕信息论悴。

語(yǔ)法:

window.screen.屬性

對(duì)象屬性:


image.png

屏幕分辨率的高和寬

window.screen 對(duì)象包含有關(guān)用戶(hù)屏幕的信息膀估。

  1. screen.height 返回屏幕分辨率的高
  2. screen.width 返回屏幕分辨率的寬
    注意:
    1.單位以像素計(jì)。
  3. window.screen 對(duì)象在編寫(xiě)時(shí)可以不使用 window 這個(gè)前綴帕棉。
    我們來(lái)獲取屏幕的高和寬饼记,代碼如下:
<script type="text/javascript">
  document.write( "屏幕寬度:"+screen.width+"px<br />" );
  document.write( "屏幕高度:"+screen.height+"px<br />" );
</script>

屏幕可用高和寬度

  1. screen.availWidth 屬性返回訪問(wèn)者屏幕的寬度,以像素計(jì)瞒窒,減去界面特性乡洼,比如任務(wù)欄。

  2. screen.availHeight 屬性返回訪問(wèn)者屏幕的高度拔稳,以像素計(jì)锹雏,減去界面特性,比如任務(wù)欄礁遵。

注意:

不同系統(tǒng)的任務(wù)欄默認(rèn)高度不一樣佣耐,及任務(wù)欄的位置可在屏幕上下左右任何位置,所以有可能可用寬度和高度不一樣兼砖。

我們來(lái)獲取屏幕的可用高和寬度,代碼如下:

<script type="text/javascript">
document.write("可用寬度:" + screen.availWidth);
document.write("可用高度:" + screen.availHeight);
</script>

注意:根據(jù)屏幕的不同顯示值不同懒叛。

編程練習(xí)

制作一個(gè)跳轉(zhuǎn)提示頁(yè)面:

要求:

  1. 如果打開(kāi)該頁(yè)面后耽梅,如果不做任何操作則5秒后自動(dòng)跳轉(zhuǎn)到一個(gè)新的地址褐墅,如慕課網(wǎng)主頁(yè)洪己。

  2. 如果點(diǎn)擊“返回”按鈕則返回前一個(gè)頁(yè)面竟贯。

效果:(動(dòng)圖)


image.png

注意: 在窗口中運(yùn)行該程序時(shí),該窗口一定要有歷史瀏覽記錄拱镐,否則"返回"無(wú)效果持际。

任務(wù)

第一步: 先編寫(xiě)好網(wǎng)頁(yè)布局,如下:

第二步: 獲取顯示秒數(shù)的元素益眉,通過(guò)定時(shí)器來(lái)更改秒數(shù)姥份。

第三步: 通過(guò)window的location和history對(duì)象來(lái)控制網(wǎng)頁(yè)的跳轉(zhuǎn)澈歉。

<!DOCTYPE html>
<html>
 <head>
  <title>瀏覽器對(duì)象</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>   
 </head>
 <body>
  <H4>操作成功</H4>
  <p>
     <b id="second">5</b>秒后回到主頁(yè)&nbsp;<a href="javascript:goBack();">返回</a>  
  </p>
 
<script type="text/javascript">  
 
    var sec = document.getElementById("second");
    var i = 5;
    var timer = setInterval(function(){
        i--;
        sec.innerHTML = i;
        if(i==1){
            window.location.;
        }
    },1000);
     
  function goBack(){ 
    window.history.go(-1);
  }  
  </script> 
 </body>
</html>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末埃难,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子涡尘,更是在濱河造成了極大的恐慌,老刑警劉巖剧罩,帶你破解...
    沈念sama閱讀 217,277評(píng)論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異幕与,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)潮饱,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,689評(píng)論 3 393
  • 文/潘曉璐 我一進(jìn)店門(mén)诫给,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)啦扬,“玉大人扑毡,你說(shuō)我怎么就攤上這事盛险。” “怎么了苦掘?”我有些...
    開(kāi)封第一講書(shū)人閱讀 163,624評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵鹤啡,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我递瑰,道長(zhǎng)泣矛,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,356評(píng)論 1 293
  • 正文 為了忘掉前任狂丝,我火速辦了婚禮哗总,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘蛋哭。我一直安慰自己涮母,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,402評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布沪蓬。 她就那樣靜靜地躺著来候,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上梆砸,一...
    開(kāi)封第一講書(shū)人閱讀 51,292評(píng)論 1 301
  • 那天帖世,我揣著相機(jī)與錄音俊庇,去河邊找鬼。 笑死辉饱,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的缔逛。 我是一名探鬼主播姓惑,決...
    沈念sama閱讀 40,135評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼于毙,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了唯沮?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書(shū)人閱讀 38,992評(píng)論 0 275
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤萌庆,失蹤者是張志新(化名)和其女友劉穎币旧,沒(méi)想到半個(gè)月后吹菱,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,429評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡垫言,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,636評(píng)論 3 334
  • 正文 我和宋清朗相戀三年倾剿,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片凛捏。...
    茶點(diǎn)故事閱讀 39,785評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡芹缔,死狀恐怖坯癣,靈堂內(nèi)的尸體忽然破棺而出示罗,到底是詐尸還是另有隱情芝硬,我是刑警寧澤,帶...
    沈念sama閱讀 35,492評(píng)論 5 345
  • 正文 年R本政府宣布绍绘,位于F島的核電站迟赃,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏纤壁。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,092評(píng)論 3 328
  • 文/蒙蒙 一欠痴、第九天 我趴在偏房一處隱蔽的房頂上張望馍佑。 院中可真熱鬧,春花似錦茵臭、人聲如沸舅世。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,723評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)罢低。三九已至胖笛,卻和暖如春宜岛,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背身弊。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,858評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工列敲, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人凑术。 一個(gè)月前我還...
    沈念sama閱讀 47,891評(píng)論 2 370
  • 正文 我出身青樓填硕,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親壮莹。 傳聞我的和親對(duì)象是個(gè)殘疾皇子姻檀,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,713評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容

  • ??ECMAScript 是 JavaScript 的核心杂抽,但如果要在 Web 中使用 JavaScript,那么...
    霜天曉閱讀 877評(píng)論 0 0
  • 概述 在瀏覽器中铸磅,window對(duì)象(注意杭朱,w為小寫(xiě))指當(dāng)前的瀏覽器窗口。它也是所有對(duì)象的頂層對(duì)象八酒。 “頂層對(duì)象”指...
    許先生__閱讀 1,668評(píng)論 0 6
  • 一刃唐、JS前言 (1)認(rèn)識(shí)JS 也許你已經(jīng)了解HTML標(biāo)記(也稱(chēng)為結(jié)構(gòu))界轩,知道了CSS樣式(也稱(chēng)為表示)闭树,會(huì)使用HT...
    凜0_0閱讀 2,770評(píng)論 0 8
  • window對(duì)象有以下方法: openclosealertconfirmpromptsetTimeoutclear...
    code武閱讀 678評(píng)論 0 1
  • 概要 64學(xué)時(shí) 3.5學(xué)分 章節(jié)安排 電子商務(wù)網(wǎng)站概況 HTML5+CSS3 JavaScript Node 電子...
    阿啊阿吖丁閱讀 9,196評(píng)論 0 3