1、獲取元素：
class 值的獲取方式：
className: 獲取元素 class 屬性值
//注 ： class 是 js 的關(guān)鍵字缅叠，規(guī)范化虏冻，不能將其做為屬性的名字
getElementById:通過 ID 值獲取 dom 對(duì)象，返回 html 元素對(duì)象领曼，
參數(shù)： 字符串蛮穿，表示? ID 屬性的賦值
getElementByClassName: 通過元素標(biāo)簽名字，獲取 DOM 元素對(duì)象单刁，返回類數(shù)組府适，
參數(shù)： 字符串肺樟，表示元素名字
getElementByTagName : 通過標(biāo)簽名獲取 html 元素
//注 ： getElement... 沒有 s 么伯，返回的都是 DOM 對(duì)象
getElements ... 返回的都是類數(shù)組
querySelector() , 返回 DOM 對(duì)象卡儒，不是數(shù)組，
參數(shù)： css 選擇器
querySelectorAll()凯楔， 返回類數(shù)組锦募，參數(shù) ： css 選擇器
2、節(jié)點(diǎn)操作
1) createElement() 創(chuàng)建 dom 節(jié)點(diǎn)虐骑，返回新建的 dom 對(duì)象
注意： js 創(chuàng)建的赎线，如果不添加到頁面中，頁面中是不存在的颠黎；
2）appendChild： 添加為父元素的最后一個(gè)子節(jié)點(diǎn)滞项，并返回添加的子節(jié)點(diǎn)
注意：如果是新增元素，需要先創(chuàng)建再添加
3) innerHTML :
~~ dom.innerHTML 返回 dom 中所有子代的字符串过椎，重新賦值
~~ 在原有的基礎(chǔ)上新增
4) innerText : 賦值內(nèi)容戏仓，類型為字符串，重新賦值敷待，不適合新增操作
// 注 ： 以上兩者應(yīng)用差不多嗓奢，初始化返回，innerHTML 中包括 html 字符串根盒，而 innerText 沒有炎滞，建議使用 innerHEML;
5) getcomputedStyle(dom,null).css屬性
返回對(duì)象，全局 css 樣式
參一： dom 對(duì)象册赛；
參二： 是否返回偽類樣式森瘪；
3、節(jié)點(diǎn)的方法：
1) nodeType ： 節(jié)點(diǎn)查詢扼睬，返回的對(duì)象窗宇，是否可以使用 DOM 下的 API，返回值可能是 text 军俊、dom 粪躬、attr
2) nodeName： 元素的標(biāo)簽名，以大寫形式表示
3）nodeValue ： text 節(jié)點(diǎn) 或 comment 節(jié)點(diǎn)的文本內(nèi)容
4) parentNodes：父節(jié)點(diǎn)（最頂端的 parentnode 為 #document）
5）parentElement：返回當(dāng)前元素的父節(jié)點(diǎn)
6）children ：子節(jié)點(diǎn)氢架，只返回當(dāng)前元素的元素子節(jié)點(diǎn)
7）firstChild ： 第一個(gè)子節(jié)點(diǎn)
8） lastChild：最后一個(gè)子節(jié)點(diǎn)
9） nextSibling ：下一個(gè)兄弟節(jié)點(diǎn)
10）previoussibling ：上一個(gè)兄弟節(jié)點(diǎn)
4朋魔、DOM 基本操作
1警检、查看滾動(dòng)條的滾動(dòng)距離：
window.pageXoffset/pageYoffset
document.body/documentElement.scrollLeft/Scrolltop(這兩個(gè)兼容性比較差害淤，用的時(shí)候同時(shí)取兩個(gè)值相加，因?yàn)椴豢赡艽嬖趦蓚€(gè)同時(shí)有值)?
2镶奉、查看視口尺寸：
window.innerWidth/innerHeight
document.documentElement.clientWidth/clientHeight //標(biāo)準(zhǔn)模式下，任意瀏覽器都兼容
document.body.clientWidth/clientHeight //適用于怪異模式下的瀏覽器
? 3鸽凶、查看元素的幾何尺寸
document.getBoundingClientRect();
兼容性好建峭，該方法返回一個(gè)對(duì)象亿蒸，對(duì)象里面有 left，top边锁，right茅坛，bottom 等屬性。 left 和 top 代表該元素左上角的 x 和 y 坐標(biāo)灰蛙，right 和bottom 代表右下角的 x 和 y 坐標(biāo)
4摩梧、讓滾動(dòng)條滾動(dòng)
window 上有三個(gè)方法
scroll() ， scrollTo() 叛薯，scrollBy()
三個(gè)方法功能類似笙纤，用法都是將 x，y 坐標(biāo)傳入抖拴。即實(shí)現(xiàn)讓滾動(dòng)條滾動(dòng)到當(dāng)前位置腥椒。
區(qū)別： scrollBy() 會(huì)在之前的數(shù)據(jù)基礎(chǔ)之上做累加笼蛛。
eg： 利用 scrollBy() 快速閱讀的功能
5、查看元素的尺寸
dom.offsetWidth
dom.offsetHeight
查看元素的位置
dom.offsetLeft
dom.offsetTop
對(duì)于屋頂為父級(jí)的元素往湿，返回相對(duì)文檔的坐標(biāo)，對(duì)于返回相對(duì)于最近的有定位的父級(jí)的坐標(biāo)
dom.offsetParent
返回最近的有定位的父級(jí)他膳，如無蔓腐，則返回body，body.offsetParent
6散罕、讓滾動(dòng)條滾動(dòng)
window 上有三個(gè)方法
scroll() 傀蓉、 scrollTo() 、 scrollBy()
三個(gè)方法功能類似误甚， 用法都是將 X谱净、Y 坐標(biāo)傳入壕探，即實(shí)現(xiàn)讓滾動(dòng)輪滾動(dòng)到當(dāng)前位置
區(qū)別： scrollby() 會(huì)在之前的基礎(chǔ)上做累加
