DOM
1.元素節(jié)點(diǎn):
元素節(jié)點(diǎn)element: 更精確的獲得元素的標(biāo)簽名(全大寫(xiě))
屬性節(jié)點(diǎn)attribute: 屬性名
文本節(jié)點(diǎn)text: #text
注釋節(jié)點(diǎn)document:#document
2.nodeType: 描述節(jié)點(diǎn)對(duì)象的類型肃弟,值是一個(gè)數(shù)字
element_NODE: 1
attribute_NODE: 2
text_NODE: 3
document_NODE: 9
3.獲取節(jié)點(diǎn)名稱:nodeName
4.節(jié)點(diǎn)的值: nodeValue
5.父子關(guān)系: parserFloat
parentNode(父節(jié)點(diǎn))
childNodes(所有子節(jié)點(diǎn))
firstChild(第一子元素)
lastChild(最后一子元素)
兄弟關(guān)系: previousSibling(上一個(gè)兄弟)
nextSibling(下一個(gè)兄弟)
元素樹(shù)父子關(guān)系: parentElementNode (父節(jié)點(diǎn))
firstElementChild(第一子元素)
lastElementChild(最后一子元素)
兄弟關(guān)系: previousElementSibling(上一個(gè)兄弟)
nextElementSibling (下一個(gè)兄弟)
6.開(kāi)始標(biāo)簽到結(jié)束標(biāo)簽之間的一切html原文:elem.innerHTML
7.獲取所有屬性的集合: elem.attributes
8.獲得指定屬性的值:elem.getAttribute("屬性名")
9.設(shè)置指定屬性的值:elem.setAttribute("屬性名","屬性值")
10.移除屬性:elem.removeAttribute("屬性名")
11.獲取焦點(diǎn)onfocus="getFocus(this)"
12.失去焦點(diǎn)onblur="valiName(this)"
13.1. HTML創(chuàng)建元素: 3步:
Step1. 創(chuàng)建空元素對(duì)象:
var elem=document.createElement("標(biāo)簽名")
相當(dāng)于: <標(biāo)簽名></標(biāo)簽名>
Step2. 為空元素添加關(guān)鍵屬性
elem.屬性名="值"
elem.innerHTML="內(nèi)容"
相當(dāng)于: <標(biāo)簽名 屬性名="值">內(nèi)容</標(biāo)簽名>
Step3. 將新元素掛到DOM樹(shù)中指定父元素下
追加: parent.appendChild(elem)
插入: parent.insertBefore(elem,現(xiàn)有元素)
替換: parent.replaceChild(elem,現(xiàn)有元素)
刪除: parent.removeChild(elem)
14.查找所有符合條件的元素var elems=document.querySelectorAll("以CSS的方式");
15.只查找一個(gè)符合條件的元素: var elem=docuemnt.querySelector("selector");
16.脫掉衣服txt.className="";
17.創(chuàng)建Option:sel.add(new Option(innerHTML,value))
18.Table:
創(chuàng)建: createTHead/TBody/TFoot
刪除: deleteTHead/TFoot
獲取: .tHead/tFoot.tBodies[i]
添加: .insertRow/Cell(i)
刪除: .deleteRow/Cell(i),
19.Form:
獲取:var form=document.form[i/id/name];
獲得表單元素:form.elements[i/id/name]
當(dāng)提交前觸發(fā):onsubmit;
BOM
1.獲取完整窗口大形蛟拧:outerWidth/outerHeight
2.獲取文檔顯示區(qū)大兄O蟆:innerWidth/innerHeight
3.新窗口大邢L:resizeTo(width,height)
resizeBy(width/height)增量
4.事件坐標(biāo):
參照屏幕左上角: e.screenX, e.screenY
參照文檔顯示區(qū)左上角: e.clientX||e.x , e.clientY||e.y
參照所在父元素的左上角: e.offsetX , e.offsetY
5.前進(jìn)/退后:history.go(1/-1)
6.當(dāng)前頁(yè)面打開(kāi)不可后退:location.replace(“url”)
7.重新加載當(dāng)前頁(yè)面: location.reload(false/true)
8.判斷是否有某一插件checkPlugin(“name”)
9.定時(shí)器一次性:clearInterval(timer);time=null
10.定時(shí)器周期性:cleartimeout(timer);time=null
11.停止定時(shí)器:
周期性: clearInterval(timer); timer=null
一次性: clearTimeout(timer); timer=null
12.添加事件監(jiān)聽(tīng):btn.addEventListener(“事件名”熏纯,函數(shù)對(duì)象)
13.刪除事件監(jiān)聽(tīng):btn.remove
14.EventListener(“事件名”桃熄,函數(shù)對(duì)象)
15.阻止冒泡:e.stopPropagation();
16.取消事件(阻止默認(rèn)行為):e.preventDefault
17.創(chuàng)建cookie: document.cookie="變量名=值;expires="+date.toGMTString();
js中包含的錯(cuò)誤:
SyntaxError: 語(yǔ)法錯(cuò)誤
ReferenceError: 引用錯(cuò)誤 要用的東西沒(méi)找到
RangeError: 范圍錯(cuò)誤 專指參數(shù)超范圍
TypeError: 類型錯(cuò)誤 錯(cuò)誤的調(diào)用了對(duì)象的方法
EvalError: raised when an error occurs executing code in eval()
URIError: raised when encodeURI() or decodeURI() are passed invalid parameters
創(chuàng)建文檔片段
Step1: 創(chuàng)建文檔片段對(duì)象:
var frag=document.createDocumentFragment();
Step2: 將平級(jí)子元素肺素,追加到文檔片段中
frag.appendChild(elem)
Step3: 將文檔片段掛到DOM樹(shù)上指定父節(jié)點(diǎn)下
parent.appendChild(frag);
補(bǔ)充:
DOM操作
如:將網(wǎng)頁(yè)中的一個(gè)圖片刪掉恨锚,以及增加一張圖片、增加一個(gè)鏈接倍靡、修改一個(gè)網(wǎng)頁(yè)的結(jié)構(gòu)猴伶,做一個(gè)廣告彈層,以及頁(yè)面上的動(dòng)態(tài)效果等等
BOM操作
如:獲取瀏覽器特性塌西,獲取當(dāng)前屏幕的寬度他挎、高度,獲取當(dāng)前地址欄地址
1.DOM操作的常用API有哪些捡需?
獲取DOM節(jié)點(diǎn)办桨,以及節(jié)點(diǎn)的property和Attribute,
獲取父節(jié)點(diǎn)站辉,獲取子節(jié)點(diǎn)呢撞,
新增節(jié)點(diǎn),刪除節(jié)點(diǎn)
2.DOM節(jié)點(diǎn)的property和Attribute有何區(qū)別饰剥?
property只是一個(gè)JS對(duì)象的屬性的修改
Attribute是對(duì)html標(biāo)簽屬性的修改
3.如何檢測(cè)瀏覽器的類型
用navigator.userAgent殊霞。
但是,有些瀏覽器用navigator.userAgent分辨不全汰蓉。360瀏覽器為了讓競(jìng)爭(zhēng)對(duì)手分不出來(lái)是Chrom還是360瀏覽器绷蹲,360瀏覽器就把navigator.userAgent做的和Chrom一模一樣。但是大部分都可以區(qū)分瀏覽器的顾孽。