JS包含哪幾部分
ES:一門語(yǔ)言珍语,學(xué)習(xí) ES學(xué)習(xí)的是語(yǔ)法
BOM:瀏覽器對(duì)象模型 用途:提供給ES一個(gè)接口來(lái)操作瀏覽器
DOM:文檔對(duì)象模型 用途:提供ES一個(gè)接口來(lái)操作文檔
BOM:瀏覽器對(duì)象模型 是操作瀏覽器的接口
BOM把瀏覽器的一切定義成了一個(gè)對(duì)象模型
Window:整個(gè)瀏覽器被定義成了一個(gè)對(duì)象模型
document:把文檔定義成了一個(gè)對(duì)象
Histroy:把歷史記錄定義成了一個(gè)對(duì)象
Screen:把顯示瀏覽器窗口的屏幕定義成了一個(gè)對(duì)象
location:把地址欄定義成一個(gè)對(duì)象
Navigator:把瀏覽器的簡(jiǎn)
BOM用途:可以讓ES操作瀏覽器的一切
BOM目前沒(méi)有標(biāo)準(zhǔn)
DOM是什么 即文檔模型
DOM:文檔對(duì)象模型
用途:DOM就是為了操作文檔
在DOM眼里齿穗,整個(gè)文檔內(nèi)容都是對(duì)象
DOM把文檔的一切內(nèi)容都定義成了對(duì)象
DOM是w3c指定的一套標(biāo)準(zhǔn)
文檔是對(duì)象
元素是對(duì)象
文本是對(duì)象
屬性是對(duì)象
節(jié)點(diǎn)對(duì)象
Document對(duì)象
Document對(duì)象表示網(wǎng)頁(yè)文檔
Document對(duì)象是DOM的核心對(duì)象
Document對(duì)象是訪問(wèn)文檔的入口
主要用途
獲取元素
創(chuàng)建新元素
刪除新元素
替換元素
獲取元素的方法
傳統(tǒng)方法
通過(guò)id獲取元素:
window.document.getElementByld()
通過(guò)class獲取元素:
document.getElementsByClassName('class')
element.getElementsByClassName('class')
通過(guò)css選擇器獲取元素: document.querySelector('selector')
通過(guò)css選擇器獲取元素:
document.querySelectorAll('selector')
element.querySelectorAll('selector')
H5新曾方法
特殊方法
console.log(document.limk)
console.log(document.links)
console.log(document.fon)
document.documentElement: 獲取?檔中的 <html> 元素
document.body: 獲取?檔中的 <body> 元素
document.head: 獲取?檔中的 <head> 元素
document.title: 獲取?檔中的 <title> 元素
document.links: 獲取?檔中的 <a> 元素
document.images: 獲取?檔中的 <img> 元素
在獲取完元素后泳叠,接下來(lái)我們要學(xué)習(xí)元素對(duì)象之間的關(guān)系,dom定義了兩套apl:
Node (節(jié)點(diǎn)API):把DOM樹中的對(duì)象看成節(jié)點(diǎn)
定義把文檔中的一起對(duì)象看出是節(jié)點(diǎn)
查找節(jié)點(diǎn)的基本信息:節(jié)點(diǎn)名稱断国,節(jié)點(diǎn)類型娱仔,節(jié)點(diǎn)的值
查找節(jié)點(diǎn)之間的關(guān)系:父子,兄弟
操作節(jié)點(diǎn):增加匿乃,刪除,改豌汇,查
三大基本屬性
Node.nodeType
表示節(jié)點(diǎn)類型幢炸,節(jié)點(diǎn)類型使用一個(gè)數(shù)字表示,分成了九種
1.元素節(jié)點(diǎn)--1
2.屬性節(jié)點(diǎn)--2
3.文本節(jié)點(diǎn)--3
4.注釋節(jié)點(diǎn)--8
5.文檔節(jié)點(diǎn)--9
節(jié)點(diǎn)定義
父節(jié)點(diǎn):一個(gè)節(jié)點(diǎn)之上的直接節(jié)點(diǎn)
子節(jié)點(diǎn):一個(gè)節(jié)點(diǎn)之下的直接節(jié)點(diǎn)
兄弟節(jié)點(diǎn):具有相同父節(jié)點(diǎn)的節(jié)點(diǎn)
后代節(jié)點(diǎn):一個(gè)節(jié)點(diǎn)之下的所有層級(jí)的節(jié)點(diǎn)
查找節(jié)點(diǎn)關(guān)系
Node.parentNode:返回當(dāng)前節(jié)點(diǎn)的父節(jié)點(diǎn)對(duì)象
Node.childNodes:返回當(dāng)前節(jié)點(diǎn)的子節(jié)點(diǎn)列表
Node.nextSibling:返回當(dāng)前節(jié)點(diǎn)的下一個(gè)兄弟節(jié)點(diǎn)
Node.previousSibling:返回當(dāng)前節(jié)點(diǎn)的上一個(gè)兄弟節(jié)點(diǎn)
Node.firstChild:返回當(dāng)前節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn)
Node.lastChild:返回當(dāng)前節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)
Node.nodeName
Node.nodeValue