JavaScript知識筆記（三）——內置對象、瀏覽器對象

內置對象：

（與Java很像）

JavaScript 中的所有事物都是對象，如:字符串、數值、數組、函數等，每個對象帶有屬性和方法。

對象的屬性：反映該對象某些特定的性質的，如：字符串的長度、圖像的長寬等；

對象的方法：能夠在對象上執行的動作。例如，表單的“提交”(Submit)，時間的“獲取”(getYear)等；

JavaScript 提供多個內建對象，比如 String、Date、Array 等等，使用對象前先定義，如下使用數組對象：

  var objectName =new Array();//使用new關鍵字定義對象
或者var objectName =[];

訪問對象屬性的語法:

objectName.propertyName

如使用 Array 對象的 length 屬性來獲得數組的長度：

var myarray=new Array(6);//定義數組對象
var myl=myarray.length;//訪問數組長度length屬性

以上代碼執行后，myl的值將是：6

訪問對象的方法：

objectName.methodName()

如使用string 對象的 toUpperCase() 方法來將文本轉換為大寫：

var mystr="Hello world!";//創建一個字符串
var request=mystr.toUpperCase(); //使用字符串對象方法

? ?以上代碼執行后，request的值是：HELLO WORLD!

? ? Date 日期對象

日期對象可以儲存任意一個日期，并且可以精確到毫秒數（1/1000 秒）。

定義一個時間對象?:

var Udate=new Date();

注意:使用關鍵字new，Date()的首字母必須大寫。?

使 Udate 成為日期對象，并且已有初始值：當前時間(當前電腦系統時間)。

如果要自定義初始值，可以用以下方法：

var d = new Date(2012, 10, 1);  //2012年10月1日
var d = new Date('Oct 1, 2012'); //2012年10月1日

我們最好使用下面介紹的“方法”來嚴格定義時間。

訪問方法語法：“<日期對象>.<方法>”

Date對象中處理時間和日期的常用方法：

? 返回/設置年份方法

get/setFullYear()?返回/設置年份，用四位數表示。

var mydate=new Date();//當前時間2015年4月28日
document.write(mydate+"<br>");//輸出當前時間
document.write(mydate.getFullYear()+"<br>");//輸出當前年份
mydate.setFullYear(91); //設置年份
document.write(mydate+"<br>"); //輸出年份被設定為 0091年。

注意:不同瀏覽器，時間格式有差異，?mydate.setFullYear(91)結果不同，年份被設定為 0091或91兩種情況。

返回星期方法

getDay()?返回星期，返回的是0-6的數字，0 表示星期天。如果要返回相對應“星期”，通過數組完成，代碼如下:

<script type="text/javascript">var mydate=new Date();//定義日期對象var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
//定義數組對象,給每個數組項賦值var mynum=mydate.getDay();//返回值存儲在變量mynum中
  document.write(mydate.getDay());//輸出getDay()獲取值document.write("今天是："+ weekday[mynum]);//輸出星期幾
</script>

注意：以上代碼是在2015年4月28日，星期二運行。

結果:

今天是：星期二

返回/設置時間方法

get/setTime()?返回/設置時間，單位毫秒數，計算從 1970 年 1 月 1 日零時到日期對象所指的日期的毫秒數。

如果將目前日期對象的時間推遲1小時，代碼如下:

<script type="text/javascript">var mydate=new Date();document.write("當前時間："+mydate+"<br>");mydate.setTime(mydate.getTime() + 60 * 60 * 1000);document.write("推遲一小時時間：" + mydate);
</script>

結果:

當前時間：當前時間：Tue Apr 28 2015 17:14:41 GMT+0800 (中國標準時間)

推遲一小時時間：Tue Apr 28 2015 18:14:41 GMT+0800 (中國標準時間)

注意:1. 一小時 60 分，一分 60 秒，一秒 1000 毫秒

?? ???2. 時間推遲 1 小時,就是: “x.setTime(x.getTime() + 60 * 60 * 1000);”

? ?String 字符串對象

定義字符串的方法就是直接賦值。比如：

var mystr = "I love JavaScript!"

定義mystr字符串后，就可以訪問它的屬性和方法。

訪問字符串對象的屬性length:

stringObject.length;?返回該字符串的長度。

var mystr="Hello World!";
var myl=mystr.length;

以上代碼執行后，myl 的值將是：12

訪問字符串對象的方法：

使用 String 對象的 toUpperCase() 方法來將字符串小寫字母轉換為大寫：

var mystr="Hello world!";
var mynum=mystr.toUpperCase();

以上代碼執行后，mynum 的值是：HELLO WORLD!

返回指定位置的字符

charAt() 方法可返回指定位置的字符。返回的字符是長度為 1 的字符串。

語法:

stringObject.charAt(index)

參數說明：

注意：1.字符串中第一個字符的下標是 0。最后一個字符的下標為字符串長度減一（string.length-1）。

? ? ? ? ? 2.如果參數 index 不在 0 與 string.length-1 之間，該方法將返回一個空字符串。

如:在字符串 "I love JavaScript!" 中，返回位置2的字符：

<script type="text/javascript">var mystr="I love JavaScript!"document.write(mystr.charAt(2));
</script>

注意：一個空格也算一個字符。

以上代碼的運行結果：

返回指定的字符串首次出現的位置

indexOf() 方法可返回某個指定的字符串值在字符串中首次出現的位置。

語法

stringObject.indexOf(substring, startpos)

參數說明：

說明：

1.該方法將從頭到尾地檢索字符串 stringObject，看它是否含有子串 substring。

2.可選參數，從stringObject的startpos位置開始查找substring，如果沒有此參數將從stringObject的開始位置查找。

3.如果找到一個 substring，則返回 substring 的第一次出現的位置。stringObject 中的字符位置是從 0 開始的。

注意：1.indexOf() 方法區分大小寫。

2.如果要檢索的字符串值沒有出現，則該方法返回 -1。

例如: 對 "I love JavaScript!" 字符串內進行不同的檢索：

<script type="text/javascript">var str="I love JavaScript!"document.write(str.indexOf("I") + "<br />");document.write(str.indexOf("v") + "<br />");document.write(str.indexOf("v",8));
</script>

以上代碼的輸出：

0
4
9

字符串分割split()

split() 方法將字符串分割為字符串數組，并返回此數組。

語法：

stringObject.split(separator,limit)

參數說明:

注意：如果把空字符串 ("") 用作 separator，那么 stringObject 中的每個字符之間都會被分割。

我們將按照不同的方式來分割字符串：

使用指定符號分割字符串，代碼如下:

var mystr = "www.imooc.com";
document.write(mystr.split(".")+"<br>");
document.write(mystr.split(".", 2)+"<br>");

運行結果:

www,imooc,com
www,imooc

將字符串分割為字符，代碼如下：

document.write(mystr.split("")+"<br>");//把字符串分割成字符
document.write(mystr.split("", 5));//把字符串分割成字符，只取分割得出的前面5個

運行結果:

w,w,w,.,i,m,o,o,c,.,c,o,m
w,w,w,.,i

提取字符串substring()

substring()方法用于提取字符串中介于兩個指定下標之間的字符。

語法:

stringObject.substring(starPos,stopPos)?

參數說明:

注意：

1. 返回的內容是從?start開始(包含start位置的字符)到?stop-1 處的所有字符，其長度為?stop?減start。

2. 如果參數?start?與?stop?相等，那么該方法返回的就是一個空串（即長度為 0 的字符串）。

3. 如果?start?比?stop?大，那么該方法在提取子串之前會先交換這兩個參數。

使用 substring() 從字符串中提取字符串，代碼如下：

<script type="text/javascript">var mystr="I love JavaScript";document.write(mystr.substring(7));document.write(mystr.substring(2,6));
</script>

運行結果:

JavaScript
love

提取指定數目的字符substr()

substr() 方法從字符串中提取從 startPos位置開始的指定數目的字符串。

語法:

stringObject.substr(startPos,length)

參數說明:

注意：如果參數startPos是負數，從字符串的尾部開始算起的位置。也就是說，-1 指字符串中最后一個字符，-2 指倒數第二個字符，以此類推。

如果startPos為負數且絕對值大于字符串長度，startPos為0。

使用 substr() 從字符串中提取一些字符，代碼如下：

<script type="text/javascript">var mystr="I love JavaScript!";document.write(mystr.substr(7));document.write(mystr.substr(2,4));
</script>

運行結果：

JavaScript!
love

JS中substr和substring的用法和區別

substr 和 substring都是JS 截取字符串函數,兩者用法很相近,下面是兩者的語法很示例:

一、substr 方法

返回一個從指定位置開始的指定長度的子字符串。
? ? ? string.substr(start [, length ])

注意:?length可選項。如?length 為 0 或負數，將返回一個空字符串。如果沒有指定該參數，則子字符串到 string 的最后。

二、substring 方法

返回位于 String 對象中指定位置的子字符串。
? ? ? ?string.substring(start, end)

注意:

substring 方法將返回一個包含從 start 到最后（不包含 end ）的子字符串的字符串。

三、示例代碼

var str = "I love JS!";// 有一個str字符串，如想獲取JS子字符串，用兩種方法如何實現。
? ? ? ?str.substr(7, 2); // 獲取子字符串。

str.substring(7, 9);?// 獲取子字符串。

結果: ?JS

區別:第二參數，substr第二個參數是獲取子字符串的長度，substring第二個參數是獲取子字符串的結束位置。

四、注意事項

substr和substring兩個函數截取帶有空格的字符串后的長度是每個空格算一個字符長度。例如：

? ? var a = "I am imooc!";

? ? a.substring(0, 5).length的值是5，而不是4，但alert(a.substring(0, 5));的值卻是I am ，這樣在做alert("I am" == a.substring(0, 5));的時候就是false了，alert("I am" == a.substring(0, 4));才是true。

Math對象

Math對象，提供對數據的數學計算。

使用 Math 的屬性和方法，代碼如下：

<script type="text/javascript">var mypi=Math.PI; var myabs=Math.abs(-15);document.write(mypi);document.write(myabs);
</script>

運行結果:

3.141592653589793
15

注意：Math 對象是一個固有的對象，無需創建它，直接把 Math 作為對象使用就可以調用其所有屬性和方法。這是它與Date,String對象的區別。

Math 對象屬性

Math 對象方法

向上取整ceil()

ceil() 方法可對一個數進行向上取整。

語法:

Math.ceil(x)

參數說明:

注意：它返回的是大于或等于x，并且與x最接近的整數。

我們將把 ceil() 方法運用到不同的數字上，代碼如下：

<script type="text/javascript">document.write(Math.ceil(0.8) + "<br />")document.write(Math.ceil(6.3) + "<br />")document.write(Math.ceil(5) + "<br />")document.write(Math.ceil(3.5) + "<br />")document.write(Math.ceil(-5.1) + "<br />")document.write(Math.ceil(-5.9))
</script>

運行結果：

向下取整floor()

floor() 方法可對一個數進行向下取整。

語法:

Math.floor(x)

參數說明：

注意：返回的是小于或等于x，并且與x最接近的整數。

我們將在不同的數字上使用 floor() 方法，代碼如下:

<script type="text/javascript">document.write(Math.floor(0.8)+ "<br>")document.write(Math.floor(6.3)+ "<br>")document.write(Math.floor(5)+ "<br>")document.write(Math.floor(3.5)+ "<br>")document.write(Math.floor(-5.1)+ "<br>")document.write(Math.floor(-5.9))
</script>

運行結果：

?四舍五入round()

round() 方法可把一個數字四舍五入為最接近的整數。

語法:

Math.round(x)

參數說明：

注意：

1. 返回與 x 最接近的整數。

2. 對于 0.5，該方法將進行上舍入。(5.5 將舍入為 6)

3.?如果?x 與兩側整數同等接近，則結果接近 +∞方向的數字值。(如?-5.5 將舍入為 -5; -5.52?將舍入為 -6),如下圖:

把不同的數舍入為最接近的整數,代碼如下：

<script type="text/javascript">document.write(Math.round(1.6)+ "<br>");document.write(Math.round(2.5)+ "<br>");document.write(Math.round(0.49)+ "<br>");document.write(Math.round(-6.4)+ "<br>");document.write(Math.round(-6.6));
</script>

運行結果：

隨機數 random()

random() 方法可返回介于 0 ~ 1（大于或等于 0 但小于 1 )之間的一個隨機數。

語法：

Math.random();

注意：返回一個大于或等于 0 但小于 1 的符號為正的數字值。

我們取得介于 0 到 1 之間的一個隨機數，代碼如下：

<script type="text/javascript">document.write(Math.random());
</script>

運行結果：

0.190305486195328?

注意:因為是隨機數，所以每次運行結果不一樣，但是0 ~ 1的數值。

獲得0 ~ 10之間的隨機數，代碼如下:

<script type="text/javascript">document.write((Math.random())*10);
</script>

運行結果：

8.72153625893887

Array 數組對象

數組對象是一個對象的集合，里邊的對象可以是不同類型的。數組的每一個成員對象都有一個“下標”，用來表示它在數組中的位置，從零開始。

數組定義的方法：

1. 定義了一個空數組:

var? 數組名= new Array();

2. 定義時指定有n個空元素的數組：

var 數組名 =new Array(n);

3.定義數組的時候，直接初始化數據：

var ?數組名 = [<元素1>, <元素2>, <元素3>...];

我們定義myArray數組，并賦值，代碼如下：

var myArray = [2, 8, 6];

說明：定義了一個數組 myArray，里邊的元素是：myArray[0] = 2; myArray[1] = 8; myArray[2] = 6。

數組元素使用：

數組名[下標] = 值;

注意: 數組的下標用方括號括起來，從0開始。

數組屬性：

length 用法：<數組對象>.length；返回：數組的長度，即數組里有多少個元素。它等于數組里最后一個元素的下標加一。

數組方法：

數組連接concat()

concat() 方法用于連接兩個或多個數組。此方法返回一個新數組，不改變原來的數組。

語法

arrayObject.concat(array1,array2,...,arrayN)

參數說明：

注意:??該方法不會改變現有的數組，而僅僅會返回被連接數組的一個副本。

我們創建一個數組，將把 concat() 中的參數連接到數組 myarr 中，代碼如下：

<script type="text/javascript">var mya = new Array(3);mya[0] = "1";mya[1] = "2";mya[2] = "3";document.write(mya.concat(4,5)+"<br>");document.write(mya); 
</script>

運行結果：

1,2,3,4,5
1,2,3

我們創建了三個數組，然后使用 concat() 把它們連接起來，代碼如下：

<script type="text/javascript">var mya1= new Array("hello!")var mya2= new Array("I","love");var mya3= new Array("JavaScript","!");var mya4=mya1.concat(mya2,mya3);document.write(mya4);
</script>

運行結果：

hello!,I,love,JavaScript,!

指定分隔符連接數組元素join()

join()方法用于把數組中的所有元素放入一個字符串。元素是通過指定的分隔符進行分隔的。

語法：

arrayObject.join(分隔符)

參數說明:

注意：返回一個字符串，該字符串把數組中的各個元素串起來，用<分隔符>置于元素與元素之間。這個方法不影響數組原本的內容。我們使用join（）方法，將數組的所有元素放入一個字符串中，代碼如下：

<script type="text/javascript">var myarr = new Array(3);myarr[0] = "I";myarr[1] = "love";myarr[2] = "JavaScript";document.write(myarr.join());
</script>

運行結果：

I,love,JavaScript

我們將使用分隔符來分隔數組中的元素，代碼如下：

<script type="text/javascript">var myarr = new Array(3)myarr[0] = "I";myarr[1] = "love";myarr[2] = "JavaScript";document.write(myarr.join("."));
</script>

運行結果：

I.love.JavaScript

顛倒數組元素順序reverse()

reverse() 方法用于顛倒數組中元素的順序。

語法：

arrayObject.reverse()

注意：該方法會改變原來的數組，而不會創建新的數組。

定義數組myarr并賦值，然后顛倒其元素的順序：

<script type="text/javascript">var myarr = new Array(3)myarr[0] = "1"myarr[1] = "2"myarr[2] = "3"document.write(myarr + "<br />")document.write(myarr.reverse())
</script>

運行結果：

1,2,3
3,2,1

選定元素slice()

slice() 方法可從已有的數組中返回選定的元素。

語法

arrayObject.slice(start,end)

參數說明：

1.返回一個新的數組，包含從 start 到 end （不包括該元素）的 arrayObject 中的元素。

2. 該方法并不會修改數組，而是返回一個子數組。

注意：

1. 可使用負值從數組的尾部選取元素。

2.如果 end 未被規定，那么 slice() 方法會選取從 start 到數組結尾的所有元素。

3. String.slice() 與 Array.slice() 相似。

我們將創建一個新數組，然后從其中選取的元素，代碼如下：

<script type="text/javascript">var myarr = new Array(1,2,3,4,5,6);document.write(myarr + "<br>");document.write(myarr.slice(2,4) + "<br>");document.write(myarr);
</script>

運行結果：

1,2,3,4,5,6
3,4
1,2,3,4,5,6

數組排序sort()

sort()方法使數組中的元素按照一定的順序排列。

語法:

arrayObject.sort(方法函數)

參數說明：

1.如果不指定<方法函數>，則按unicode碼順序排列。

2.如果指定<方法函數>，則按<方法函數>所指定的排序方法排序。

myArray.sort(sortMethod);

注意:?該函數要比較兩個值，然后返回一個用于說明這兩個值的相對順序的數字。比較函數應該具有兩個參數 a 和 b，其返回值如下：?

? 若返回值<=-1，則表示 A 在排序后的序列中出現在 B 之前。
? 若返回值>-1 && <1，則表示 A 和 B 具有相同的排序順序。
? 若返回值>=1，則表示 A 在排序后的序列中出現在 B 之后。

1.使用sort()將數組進行排序，代碼如下：

<script type="text/javascript">var myarr1 = new Array("Hello","John","love","JavaScript"); var myarr2 = new Array("80","16","50","6","100","1");document.write(myarr1.sort()+"<br>");document.write(myarr2.sort());
</script>

運行結果：

Hello,JavaScript,John,love
1,100,16,50,6,80

注意:上面的代碼沒有按照數值的大小對數字進行排序。

2.如要實現這一點，就必須使用一個排序函數，代碼如下：

<script type="text/javascript">function sortNum(a,b) {return a - b;//升序，如降序，把“a - b”該成“b - a”
}var myarr = new Array("80","16","50","6","100","1");document.write(myarr + "<br>");document.write(myarr.sort(sortNum));
</script>

運行結果：

80,16,50,6,100,1
1,6,16,50,80,100

window對象

window對象是BOM（瀏覽器對象模型）的核心，window對象指當前的瀏覽器窗口。

window對象方法:

JavaScript 計時器

在JavaScript中，我們可以在設定的時間間隔之后來執行代碼，而不是在函數被調用后立即執行。
計時器類型：
一次性計時器：僅在指定的延遲時間之后觸發一次。
間隔性觸發計時器：每隔一定的時間間隔就觸發一次。
計時器方法：

計時器setInterval()

在執行時,從載入頁面后每隔指定的時間執行代碼。

語法:

setInterval(代碼,交互時間);

參數說明：

1. 代碼：要調用的函數或要執行的代碼串。

2. 交互時間：周期性執行或調用表達式之間的時間間隔，以毫秒計（1s=1000ms）。

返回值:

一個可以傳遞給 clearInterval() 從而取消對"代碼"的周期性執行的值。

調用函數格式(假設有一個clock()函數):

setInterval("clock()",1000)
或
setInterval(clock,1000)

我們設置一個計時器，每隔100毫秒調用clock()函數，并將時間顯示出來，代碼如下:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>計時器</title>
<script type="text/javascript">var int=setInterval(clock, 100)function clock(){var time=new Date();document.getElementById("clock").value = time;}
</script>
</head>
<body><form><input type="text" id="clock" size="50"  /></form>
</body>
</html>

取消計時器clearInterval()

clearInterval() 方法可取消由 setInterval() 設置的交互時間。

語法：

clearInterval(id_of_setInterval)

參數說明:
id_of_setInterval：由 setInterval() 返回的 ID 值。

每隔 100 毫秒調用 clock() 函數,并顯示時間。當點擊按鈕時，停止時間,代碼如下:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>計時器</title>
<script type="text/javascript">function clock(){var time=new Date();                     document.getElementById("clock").value = time;}
// 每隔100毫秒調用clock函數，并將返回值賦值給ivar i=setInterval("clock()",100);
</script>
</head>
<body><form><input type="text" id="clock" size="50"  /><input type="button" value="Stop" οnclick="clearInterval(i)"  /></form>
</body>
</html>

計時器setTimeout()

setTimeout()計時器，在載入后延遲指定時間后,去執行一次表達式,僅執行一次。

語法:

setTimeout(代碼,延遲時間);

參數說明：

1. 要調用的函數或要執行的代碼串。
2. 延時時間：在執行代碼前需等待的時間，以毫秒為單位（1s=1000ms)。

當我們打開網頁3秒后，在彈出一個提示框，代碼如下:

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">setTimeout("alert('Hello!')", 3000 );
</script>
</head>
<body>
</body>
</html>

當按鈕start被點擊時，setTimeout()調用函數，在5秒后彈出一個提示框。

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function tinfo(){var t=setTimeout("alert('Hello!')",5000);}
</script>
</head>
<body>
<form><input type="button" value="start" onClick="tinfo()">
</form>
</body>
</html>

要創建一個運行于無窮循環中的計數器，我們需要編寫一個函數來調用其自身。在下面的代碼，當按鈕被點擊后，輸入域便從0開始計數。

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
var num=0;
function numCount(){document.getElementById('txt').value=num;num=num+1;setTimeout("numCount()",1000);}
</script>
</head>
<body>
<form>
<input type="text" id="txt" />
<input type="button" value="Start" onClick="numCount()" />
</form>
</body>
</html>

取消計時器clearTimeout()

setTimeout()和clearTimeout()一起使用，停止計時器。

語法:

clearTimeout(id_of_setTimeout)

參數說明:
id_of_setTimeout：由 setTimeout() 返回的 ID 值。該值標識要取消的延遲執行代碼塊。

下面的例子和上節的無窮循環的例子相似。唯一不同是，現在我們添加了一個 "Stop" 按鈕來停止這個計數器：

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">var num=0,i;function timedCount(){document.getElementById('txt').value=num;num=num+1;i=setTimeout(timedCount,1000);}setTimeout(timedCount,1000);function stopCount(){clearTimeout(i);}
</script>
</head>
<body><form><input type="text" id="txt"><input type="button" value="Stop" onClick="stopCount()"></form>
</body>
</html>

History 對象

history對象記錄了用戶曾經瀏覽過的頁面(URL)，并可以實現瀏覽器前進與后退相似導航的功能。

注意:從窗口被打開那刻開始記錄，每個瀏覽器窗口、每個標簽頁乃至每個框架，都有自己的history對象與特定的window對象關聯。

語法：

window.history.[屬性|方法]

注意：window可以省略。

History 對象屬性

History 對象方法

使用length屬性，當前窗口的瀏覽歷史總長度，代碼如下：

<script type="text/javascript">var HL = window.history.length;document.write(HL);
</script>

返回前一個瀏覽的頁面

back()方法，加載 history 列表中的前一個 URL。

語法：

window.history.back();

比如，返回前一個瀏覽的頁面，代碼如下：

window.history.back();

注意：等同于點擊瀏覽器的倒退按鈕。

back()相當于go(-1),代碼如下:

window.history.go(-1);

返回下一個瀏覽的頁面

forward()方法，加載 history 列表中的下一個 URL。

如果倒退之后，再想回到倒退之前瀏覽的頁面，則可以使用forward()方法,代碼如下:

window.history.forward();

注意：等價點擊前進按鈕。

forward()相當于go(1),代碼如下:

window.history.go(1);

返回瀏覽歷史中的其他頁面

go()方法，根據當前所處的頁面，加載 history 列表中的某個具體的頁面。

語法：

window.history.go(number);

參數：

瀏覽器中，返回當前頁面之前瀏覽過的第二個歷史頁面，代碼如下：

window.history.go(-2);

注意：和在瀏覽器中單擊兩次后退按鈕操作一樣。

同理，返回當前頁面之后瀏覽過的第三個歷史頁面，代碼如下：

window.history.go(3);

Location對象

location用于獲取或設置窗體的URL，并且可以用于解析URL。

語法:

location.[屬性|方法]

document.write(window.location.href);//獲取當前顯示文檔的URL

location對象屬性圖示:

location 對象屬性：

location 對象方法:

Navigator對象

Navigator 對象包含有關瀏覽器的信息，通常用于檢測瀏覽器與操作系統的版本。

對象屬性:

查看瀏覽器的名稱和版本，代碼如下:

<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

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

語法

navigator.userAgent

幾種瀏覽的user_agent.，像360的兼容模式用的是IE、極速模式用的是chrom的內核。

使用userAgent判斷使用的是什么瀏覽器(假設使用的是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>"); 
}

運行結果:

screen對象

screen對象用于獲取用戶的屏幕信息。

語法：

window.screen.屬性

對象屬性:

屏幕分辨率的高和寬

window.screen 對象包含有關用戶屏幕的信息。
1. screen.height 返回屏幕分辨率的高
2. screen.width 返回屏幕分辨率的寬
注意:
1.單位以像素計。
2. window.screen 對象在編寫時可以不使用 window 這個前綴。
我們來獲取屏幕的高和寬，代碼如下:

<script type="text/javascript">document.write( "屏幕寬度："+screen.width+"px<br />" );document.write( "屏幕高度："+screen.height+"px<br />" );
</script>

屏幕可用高和寬度

1. screen.availWidth 屬性返回訪問者屏幕的寬度，以像素計，減去界面特性，比如任務欄。

2. screen.availHeight 屬性返回訪問者屏幕的高度，以像素計，減去界面特性，比如任務欄。

注意:

不同系統的任務欄默認高度不一樣，及任務欄的位置可在屏幕上下左右任何位置，所以有可能可用寬度和高度不一樣。

我們來獲取屏幕的可用高和寬度，代碼如下：

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

注意:根據屏幕的不同顯示值不同。

編程練習：

制作一個跳轉提示頁面：

要求：

1. 如果打開該頁面后，如果不做任何操作則5秒后自動跳轉到一個新的地址，如慕課網主頁。

2. 如果點擊“返回”按鈕則返回前一個頁面。

效果:

注意: 在窗口中運行該程序時，該窗口一定要有歷史瀏覽記錄，否則"返回"無效果。

<!DOCTYPE html>
<html><head><title>瀏覽器對象</title>  <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>   </head><body><!--先編寫好網頁布局--><h1>操作成功</h1>
<span id="second" >5</span><span >秒后回到主頁</span><a href="javascript:back();">返回</a><script type="text/javascript">  var num=document.getElementById("second").innerHTML;//獲取顯示秒數的元素，通過定時器來更改秒數。function count(){num--;document.getElementById("second").innerHTML=num;if(num==0){location.assign("Http://www.imooc.com");}}setInterval("count()",1000);//通過window的location和history對象來控制網頁的跳轉。function back(){window.history.back();}</script> 
</body>
</html>

————————————————————————————————————————————————————————————————————-——

? ? ? ? ? 以上內容參考自慕課網：http://www.imooc.com