js 基礎學習地址：http://www.w3school.com.cn/

JS對象類型：本地對象、宿主對象（瀏覽器對象）、內置對象

? ? ? ? ? ? 本地對象：獨立于宿主環境的ECMAScript實現提供的對象，簡單來說本地對象就是EMCA-262定義的類（引用類或者api類）。它們包括Array ? ?Boolean ?Date ? Function ? Number ?String ? Object ? RegExp Math ?Global??以及各種錯誤對象Error等等。

? ? ? ? ? ? ? 宿主對象：執行的js腳本的環境所提供的對象，其瀏覽器提供的對象。所以被本地對象都是宿主對象，所有BOM（window、Navigator、Screen、History、Location）和DOM對象都是宿主對象。 如document、timing、popupAlert、cookie。

? ? ? ? ? ? ? 內置對象：獨立于宿主環境的所有對象，開發者不必明確實例化內置對象，它已經被實例化了。 Math ?Global 也屬于本地對象。

js宿主對象--BOM和DOM

1）window :當前的窗口
window常用的方法：
open() ? 打開一個新的資源。
moveTo() 將窗口左上角的屏幕位置移動到指定的 x 和 y 位置。
moveBy() ?相對于當前的窗口移動指定的 x 和 y 偏移值(左上角)。
setInterval() ?每隔指定的毫秒數指定指定的代碼。
setTimeout（） 經過指定毫秒數指定一次指定的代碼。?
A）
open()方法接收4個參數，分別是 打開資源名；打開方式；打開的窗口大小位置；資源找不到是否用其他代替。

下面是一個例子：
function openImage()
{
window.open("image.html","_blank","height = 500pt,width = 350pt,top = 50pt,left = 450pt",false);
}

其中第三個參數設置各種屬性，我們用逗號分割開。
B）其它方法示例：
window.moveTo(100,100);
window.moveBy(30,0);?
傳入的參數都是移動的數值，知識參考的原點不同。
C）setInterval() ?每隔指定的毫秒數指定指定的代碼。循環執行
? 例子： var id = window.setInterval("showImage()",2000);
? 我們可以通過window.clearInterval(id); 來停止上面的執行循環。
? ?setTimeout（） 經過指定毫秒數指定一次指定的代碼。只執行一次
? ?例子：window.setTimeout("showImage()",2000);

2）地址欄對象
location ?（url地址欄對象）
常用方法有
href: 設置或獲取整個 URL 為字符串。
reload() ：重新加載頁面地址。
示例：
document.write("當前地址欄的地址："+location.href); 獲取地址欄地址
location.href = "http://www.baidu.com"; ? ?設置地址欄地址
location.reload(); ?重新加載地址欄地址

3）navigator 對象

Navigator 對象包含有關瀏覽器的信息。

注釋：沒有應用于 navigator 對象的公開標準，不過所有瀏覽器都支持該對象。

Navigator 對象集合

集合 描述

plugins[]	返回對文檔中所有嵌入式對象的引用。 該集合是一個 Plugin 對象的數組，其中的元素代表瀏覽器已經安裝的插件。Plug-in 對象提供的是有關插件的信息，其中包括它所支持的 MIME 類型的列表。 雖然 plugins[] 數組是由 IE 4 定義的，但是在 IE 4 中它卻總是空的，因為 IE 4 不支持插件和 Plugin 對象。

Navigator 對象屬性

屬性 描述

appCodeName	返回瀏覽器的代碼名。
appMinorVersion	返回瀏覽器的次級版本。
appName	返回瀏覽器的名稱。
appVersion	返回瀏覽器的平臺和版本信息。
browserLanguage	返回當前瀏覽器的語言。
cookieEnabled	返回指明瀏覽器中是否啟用 cookie 的布爾值。
cpuClass	返回瀏覽器系統的 CPU 等級。
onLine	返回指明系統是否處于脫機模式的布爾值。
platform	返回運行瀏覽器的操作系統平臺。
systemLanguage	返回 OS 使用的默認語言。
userAgent	返回由客戶機發送服務器的 user-agent 頭部的值。
userLanguage	返回 OS 的自然語言設置。

Navigator 對象方法

方法 描述

javaEnabled()	規定瀏覽器是否啟用 Java。
taintEnabled()	規定瀏覽器是否啟用數據污點 (data tainting)。

Navigator 對象描述

Navigator 對象包含的屬性描述了正在使用的瀏覽器。可以使用這些屬性進行平臺專用的配置。

雖然這個對象的名稱顯而易見的是 Netscape 的 Navigator 瀏覽器，但其他實現了 JavaScript 的瀏覽器也支持這個對象。

Navigator 對象的實例是唯一的，可以用 Window 對象的 navigator 屬性來引用它。

4）history 對象

History 對象

History 對象包含用戶（在瀏覽器窗口中）訪問過的 URL。

History 對象是 window 對象的一部分，可通過 window.history 屬性對其進行訪問。

注釋：沒有應用于 History 對象的公開標準，不過所有瀏覽器都支持該對象。

History 對象屬性

屬性 描述

length	返回瀏覽器歷史列表中的 URL 數量。

History 對象方法

方法 描述

back()	加載 history 列表中的前一個 URL。
forward()	加載 history 列表中的下一個 URL。
go()	加載 history 列表中的某個具體頁面。

History 對象描述

History 對象最初設計來表示窗口的瀏覽歷史。但出于隱私方面的原因，History 對象不再允許腳本訪問已經訪問過的實際 URL。唯一保持使用的功能只有?back()、forward()?和?go()?方法。

例子

下面一行代碼執行的操作與單擊后退按鈕執行的操作一樣：

history.back()

下面一行代碼執行的操作與單擊兩次后退按鈕執行的操作一樣：

history.go(-2)

5）screen 對象

Screen 對象

Screen 對象包含有關客戶端顯示屏幕的信息。

注釋：沒有應用于 screen 對象的公開標準，不過所有瀏覽器都支持該對象。

Screen 對象屬性

屬性 描述

availHeight	返回顯示屏幕的高度 (除 Windows 任務欄之外)。
availWidth	返回顯示屏幕的寬度 (除 Windows 任務欄之外)。
bufferDepth	設置或返回調色板的比特深度。
colorDepth	返回目標設備或緩沖器上的調色板的比特深度。
deviceXDPI	返回顯示屏幕的每英寸水平點數。
deviceYDPI	返回顯示屏幕的每英寸垂直點數。
fontSmoothingEnabled	返回用戶是否在顯示控制面板中啟用了字體平滑。
height	返回顯示屏幕的高度。
logicalXDPI	返回顯示屏幕每英寸的水平方向的常規點數。
logicalYDPI	返回顯示屏幕每英寸的垂直方向的常規點數。
pixelDepth	返回顯示屏幕的顏色分辨率（比特每像素）。
updateInterval	設置或返回屏幕的刷新率。
width	返回顯示器屏幕的寬度。

Screen 對象描述

每個 Window 對象的 screen 屬性都引用一個 Screen 對象。Screen 對象中存放著有關顯示瀏覽器屏幕的信息。JavaScript 程序將利用這些信息來優化它們的輸出，以達到用戶的顯示要求。例如，一個程序可以根據顯示器的尺寸選擇使用大圖像還是使用小圖像，它還可以根據顯示器的顏色深度選擇使用 16 位色還是使用 8 位色的圖形。另外，JavaScript 程序還能根據有關屏幕尺寸的信息將新的瀏覽器窗口定位在屏幕中間。

js 宿主對象DOM對象 -- document，event，element，attribute（四大對象）

Event 對象

Event 對象代表事件的狀態，比如事件在其中發生的元素、鍵盤按鍵的狀態、鼠標的位置、鼠標按鈕的狀態。

事件通常與函數結合使用，函數不會在事件發生前被執行！

事件句柄　(Event Handlers)

HTML 4.0 的新特性之一是能夠使 HTML 事件觸發瀏覽器中的行為，比如當用戶點擊某個 HTML 元素時啟動一段 JavaScript。下面是一個屬性列表，可將之插入 HTML 標簽以定義事件的行為。

屬性 此事件發生在何時...

onabort	圖像的加載被中斷。
onblur	元素失去焦點。
onchange	域的內容被改變。
onclick	當用戶點擊某個對象時調用的事件句柄。
ondblclick	當用戶雙擊某個對象時調用的事件句柄。
onerror	在加載文檔或圖像時發生錯誤。
onfocus	元素獲得焦點。
onkeydown	某個鍵盤按鍵被按下。
onkeypress	某個鍵盤按鍵被按下并松開。
onkeyup	某個鍵盤按鍵被松開。
onload	一張頁面或一幅圖像完成加載。
onmousedown	鼠標按鈕被按下。
onmousemove	鼠標被移動。
onmouseout	鼠標從某元素移開。
onmouseover	鼠標移到某元素之上。
onmouseup	鼠標按鍵被松開。
onreset	重置按鈕被點擊。
onresize	窗口或框架被重新調整大小。
onselect	文本被選中。
onsubmit	確認按鈕被點擊。
onunload	用戶退出頁面。

鼠標 / 鍵盤屬性

屬性 描述

altKey	返回當事件被觸發時，"ALT" 是否被按下。
button	返回當事件被觸發時，哪個鼠標按鈕被點擊。
clientX	返回當事件被觸發時，鼠標指針的水平坐標。
clientY	返回當事件被觸發時，鼠標指針的垂直坐標。
ctrlKey	返回當事件被觸發時，"CTRL" 鍵是否被按下。
metaKey	返回當事件被觸發時，"meta" 鍵是否被按下。
relatedTarget	返回與事件的目標節點相關的節點。
screenX	返回當某個事件被觸發時，鼠標指針的水平坐標。
screenY	返回當某個事件被觸發時，鼠標指針的垂直坐標。
shiftKey	返回當事件被觸發時，"SHIFT" 鍵是否被按下。

IE 屬性

除了上面的鼠標/事件屬性，IE 瀏覽器還支持下面的屬性：

屬性 描述

cancelBubble	如果事件句柄想阻止事件傳播到包容對象，必須把該屬性設為 true。
fromElement	對于 mouseover 和 mouseout 事件，fromElement 引用移出鼠標的元素。
keyCode	對于 keypress 事件，該屬性聲明了被敲擊的鍵生成的 Unicode 字符碼。對于 keydown 和 keyup 事件，它指定了被敲擊的鍵的虛擬鍵盤碼。虛擬鍵盤碼可能和使用的鍵盤的布局相關。
offsetX,offsetY	發生事件的地點在事件源元素的坐標系統中的 x 坐標和 y 坐標。
returnValue	如果設置了該屬性，它的值比事件句柄的返回值優先級高。把這個屬性設置為 fasle，可以取消發生事件的源元素的默認動作。
srcElement	對于生成事件的 Window 對象、Document 對象或 Element 對象的引用。
toElement	對于 mouseover 和 mouseout 事件，該屬性引用移入鼠標的元素。
x,y	事件發生的位置的 x 坐標和 y 坐標，它們相對于用CSS動態定位的最內層包容元素。

標準 Event 屬性

下面列出了 2 級 DOM 事件標準定義的屬性。

屬性 描述

bubbles	返回布爾值，指示事件是否是起泡事件類型。
cancelable	返回布爾值，指示事件是否可擁可取消的默認動作。
currentTarget	返回其事件監聽器觸發該事件的元素。
eventPhase	返回事件傳播的當前階段。
target	返回觸發此事件的元素（事件的目標節點）。
timeStamp	返回事件生成的日期和時間。
type	返回當前 Event 對象表示的事件的名稱。

標準 Event 方法

下面列出了 2 級 DOM 事件標準定義的方法。IE 的事件模型不支持這些方法：

方法 描述

initEvent()	初始化新創建的 Event 對象的屬性。
preventDefault()	通知瀏覽器不要執行與事件關聯的默認動作。
stopPropagation()	不再派發事件。

Document 對象

每個載入瀏覽器的 HTML 文檔都會成為 Document 對象。

Document 對象使我們可以從腳本中對 HTML 頁面中的所有元素進行訪問。

提示：Document 對象是 Window 對象的一部分，可通過 window.document 屬性對其進行訪問。

Document 對象集合

集合 描述

all[]	提供對文檔中所有 HTML 元素的訪問。
anchors[]	返回對文檔中所有 Anchor 對象的引用。
applets	返回對文檔中所有 Applet 對象的引用。
forms[]	返回對文檔中所有 Form 對象引用。
images[]	返回對文檔中所有 Image 對象引用。
links[]	返回對文檔中所有 Area 和 Link 對象引用。

Document 對象屬性

屬性 描述

body	提供對 <body> 元素的直接訪問。 對于定義了框架集的文檔，該屬性引用最外層的 <frameset>。
cookie	設置或返回與當前文檔有關的所有 cookie。
domain	返回當前文檔的域名。
lastModified	返回文檔被最后修改的日期和時間。
referrer	返回載入當前文檔的文檔的 URL。
title	返回當前文檔的標題。
URL	返回當前文檔的 URL。

Document 對象方法

方法 描述

close()	關閉用 document.open() 方法打開的輸出流，并顯示選定的數據。
getElementById()	返回對擁有指定 id 的第一個對象的引用。
getElementsByName()	返回帶有指定名稱的對象集合。
getElementsByTagName()	返回帶有指定標簽名的對象集合。
open()	打開一個流，以收集來自任何 document.write() 或 document.writeln() 方法的輸出。
write()	向文檔寫 HTML 表達式 或 JavaScript 代碼。
writeln()	等同于 write() 方法，不同的是在每個表達式之后寫一個換行符。

Document 對象描述

HTMLDocument 接口對 DOM Document 接口進行了擴展，定義 HTML 專用的屬性和方法。

很多屬性和方法都是 HTMLCollection 對象（實際上是可以用數組或名稱索引的只讀數組），其中保存了對錨、表單、鏈接以及其他可腳本元素的引用。

這些集合屬性都源自于 0 級 DOM。它們已經被?Document.getElementsByTagName()?所取代，但是仍然常常使用，因為他們很方便。

write() 方法值得注意，在文檔載入和解析的時候，它允許一個腳本向文檔中插入動態生成的內容。

注意，在 1 級 DOM 中，HTMLDocument 定義了一個名為?getElementById()?的非常有用的方法。在 2 級 DOM 中，該方法已經被轉移到了 Document 接口，它現在由 HTMLDocument 繼承而不是由它定義了。

Element 對象

在 HTML DOM 中，Element 對象表示 HTML 元素。

Element 對象可以擁有類型為元素節點、文本節點、注釋節點的子節點。

NodeList 對象表示節點列表，比如 HTML 元素的子節點集合。

元素也可以擁有屬性。屬性是屬性節點（參見下一節）。

瀏覽器支持

IE Firefox Chrome Safari Opera

?	?	?	?	?

所有瀏覽器都支持 Element 對象和 NodeList 對象。

屬性和方法

下面的屬性和方法可用于所有 HTML 元素上：

屬性 / 方法 描述

element.accessKey	設置或返回元素的快捷鍵。
element.appendChild()	向元素添加新的子節點，作為最后一個子節點。
element.attributes	返回元素屬性的 NamedNodeMap。
element.childNodes	返回元素子節點的 NodeList。
element.className	設置或返回元素的 class 屬性。
element.clientHeight	返回元素的可見高度。
element.clientWidth	返回元素的可見寬度。
element.cloneNode()	克隆元素。
element.compareDocumentPosition()	比較兩個元素的文檔位置。
element.contentEditable	設置或返回元素的文本方向。
element.dir	設置或返回元素的文本方向。
element.firstChild	返回元素的首個子。
element.getAttribute()	返回元素節點的指定屬性值。
element.getAttributeNode()	返回指定的屬性節點。
element.getElementsByTagName()	返回擁有指定標簽名的所有子元素的集合。
element.getFeature()	返回實現了指定特性的 API 的某個對象。
element.getUserData()	返回關聯元素上鍵的對象。
element.hasAttribute()	如果元素擁有指定屬性，則返回true，否則返回 false。
element.hasAttributes()	如果元素擁有屬性，則返回 true，否則返回 false。
element.hasChildNodes()	如果元素擁有子節點，則返回 true，否則 false。
element.id	設置或返回元素的 id。
element.innerHTML	設置或返回元素的內容。
element.insertBefore()	在指定的已有的子節點之前插入新節點。
element.isContentEditable	設置或返回元素的內容。
element.isDefaultNamespace()	如果指定的 namespaceURI 是默認的，則返回 true，否則返回 false。
element.isEqualNode()	檢查兩個元素是否相等。
element.isSameNode()	檢查兩個元素是否是相同的節點。
element.isSupported()	如果元素支持指定特性，則返回 true。
element.lang	設置或返回元素的語言代碼。
element.lastChild	返回元素的最后一個子元素。
element.namespaceURI	返回元素的 namespace URI。
element.nextSibling	返回位于相同節點樹層級的下一個節點。
element.nodeName	返回元素的名稱。
element.nodeType	返回元素的節點類型。
element.nodeValue	設置或返回元素值。
element.normalize()	合并元素中相鄰的文本節點，并移除空的文本節點。
element.offsetHeight	返回元素的高度。
element.offsetWidth	返回元素的寬度。
element.offsetLeft	返回元素的水平偏移位置。
element.offsetParent	返回元素的偏移容器。
element.offsetTop	返回元素的垂直偏移位置。
element.ownerDocument	返回元素的根元素（文檔對象）。
element.parentNode	返回元素的父節點。
element.previousSibling	返回位于相同節點樹層級的前一個元素。
element.removeAttribute()	從元素中移除指定屬性。
element.removeAttributeNode()	移除指定的屬性節點，并返回被移除的節點。
element.removeChild()	從元素中移除子節點。
element.replaceChild()	替換元素中的子節點。
element.scrollHeight	返回元素的整體高度。
element.scrollLeft	返回元素左邊緣與視圖之間的距離。
element.scrollTop	返回元素上邊緣與視圖之間的距離。
element.scrollWidth	返回元素的整體寬度。
element.setAttribute()	把指定屬性設置或更改為指定值。
element.setAttributeNode()	設置或更改指定屬性節點。
element.setIdAttribute()	?
element.setIdAttributeNode()	?
element.setUserData()	把對象關聯到元素上的鍵。
element.style	設置或返回元素的 style 屬性。
element.tabIndex	設置或返回元素的 tab 鍵控制次序。
element.tagName	返回元素的標簽名。
element.textContent	設置或返回節點及其后代的文本內容。
element.title	設置或返回元素的 title 屬性。
element.toString()	把元素轉換為字符串。
nodelist.item()	返回 NodeList 中位于指定下標的節點。
nodelist.length	返回 NodeList 中的節點數。

Attr 對象

在 HTML DOM 中，Attr?對象表示 HTML 屬性。

HTML 屬性始終屬于 HTML 元素。

NamedNodeMap 對象

在 HTML DOM 中，NamedNodeMap?對象表示元素屬性節點的無序集合。

NamedNodeMap 中的節點可通過名稱或索引（數字）來訪問。

瀏覽器支持

IE Firefox Chrome Safari Opera

?	?	?	?	?

所有瀏覽器都支持 Attr 對象和 NamedNodeMap 對象。

屬性和方法

屬性 / 方法 描述

attr.isId	如果屬性是 id 類型，則返回 true，否則返回 false。
attr.name	返回屬性的名稱。
attr.value	設置或返回屬性的值。
attr.specified	如果已指定屬性，則返回 true，否則返回 false。
nodemap.getNamedItem()	從 NamedNodeMap 返回指定的屬性節點。
nodemap.item()	返回 NamedNodeMap 中位于指定下標的節點。
nodemap.length	返回 NamedNodeMap 中的節點數。
nodemap.removeNamedItem()	移除指定的屬性節點。
nodemap.setNamedItem()	設置指定的屬性節點（通過名稱）。

DOM 4 警告！

在 W3C DOM Core 中，Attr (attribute) 對象從 Node 對象繼承所有屬性和方法。

在 DOM 4 中，Attr 對象不再從 Node 繼承。

為了保證未來的代碼安全，您應該避免在屬性對象上使用節點對象的屬性和方法：

屬性 / 方法 避免的理由

attr.appendChild()	屬性沒有子節點。
attr.attributes	屬性沒有屬性。
attr.baseURI	使用 document.baseURI 代替。
attr.childNodes	屬性沒有子節點。
attr.cloneNode()	使用 attr.value 代替。
attr.firstChild	屬性沒有子節點。
attr.hasAttributes()	屬性沒有屬性。
attr.hasChildNodes	屬性沒有子節點。
attr.insertBefore()	屬性沒有子節點。
attr.isEqualNode()	沒有意義。
attr.isSameNode()	沒有意義。
attr.isSupported()	始終為 true。
attr.lastChild	屬性沒有子節點。
attr.nextSibling	屬性沒有同級節點。
attr.nodeName	使用 attr.name 代替。
attr.nodeType	始終為 2 (ATTRIBUTE_NODE)。
attr.nodeValue	使用 attr.value 代替。
attr.normalize()	屬性無法被正常化。
attr.ownerDocument	始終是您的 HTML 文檔。
attr.ownerElement	這是您用來訪問該屬性的 HTML 元素。
attr.parentNode	這是您用來訪問該屬性的 HTML 元素。
attr.previousSibling	屬性沒有同級節點。
attr.removeChild	屬性沒有子節點。
attr.replaceChild	屬性沒有子節點。
attr.textContent	使用 attr.value 代替。

總結

以上是生活随笔為你收集整理的js中的对象类型与具体的对象的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。