摘要:也就是說(shuō),只要瀏覽器開始載入文檔,這個(gè)對(duì)象就開始存在了,可以直接調(diào)用。屬性返回該對(duì)象的所有子節(jié)點(diǎn)。第一個(gè)子節(jié)點(diǎn)是,表示文檔類型節(jié)點(diǎn)。第二個(gè)子節(jié)點(diǎn)是,表示元素節(jié)點(diǎn),代表。是在對(duì)象中創(chuàng)建一個(gè)對(duì)象,要與或方法聯(lián)合使用。
贊助我以寫出更好的文章,give me a cup of coffee?
2017最新最全前端面試題
在瀏覽器中,與用戶進(jìn)行數(shù)據(jù)交換都是通過(guò)客戶端的javascript代碼來(lái)實(shí)現(xiàn)的,而完成這些交互工作大多數(shù)是document 對(duì)象及其部件進(jìn)行的,因此document對(duì)象是一個(gè)比較重要的對(duì)象。
document對(duì)象概述document對(duì)象是文檔的根節(jié)點(diǎn),window.document屬性就指向這個(gè)對(duì)象。也就是說(shuō),只要瀏覽器開始載入HTML文檔,這個(gè)對(duì)象就開始存在了,可以直接調(diào)用。
document.childNodes屬性返回該對(duì)象的所有子節(jié)點(diǎn)。對(duì)于HTML文檔來(lái)說(shuō),document對(duì)象一般有兩個(gè)子節(jié)點(diǎn)。
第一個(gè)子節(jié)點(diǎn)是document.doctype,表示文檔類型節(jié)點(diǎn)(DocumentType)。對(duì)于HTML5文檔來(lái)說(shuō),該節(jié)點(diǎn)就代表。
第二個(gè)子節(jié)點(diǎn)是document.documentElement,表示元素節(jié)點(diǎn)(Element),代表:。
document 對(duì)象的屬性document對(duì)象主要有如下屬性:
屬性 | 說(shuō)明 |
---|---|
document.title | 設(shè)置文檔標(biāo)題等價(jià)于HTML的 |
document.bgColor | 設(shè)置頁(yè)面背景色 |
document.linkColor | 未點(diǎn)擊過(guò)的鏈接顏色 |
document.alinkColor | 激活鏈接(焦點(diǎn)在此鏈接上)的顏色 |
document.fgColor | 設(shè)置前景色(文本顏色) |
document.vlinkColor | 已點(diǎn)擊過(guò)的鏈接顏色 |
document.URL | 設(shè)置URL屬性從而在同一窗口打開另一網(wǎng)頁(yè) |
document.fileCreatedDate | 文件建立日期,只讀屬性 |
document.fileModifiedDate | 文件修改日期,只讀屬性 |
document.fileSize | 文件大小,只讀屬性 |
document.cookie | 設(shè)置和讀出cookie |
document.charset | 設(shè)置字符集 簡(jiǎn)體中文:gb2312 |
document.doctype // document.documentElement //返回文檔的根節(jié)點(diǎn) ... document.head // ... document.body // ... document.defaultView // window document.querySelector("textarea").focus(); document.activeElement //
querySelector返回的是一個(gè)對(duì)象,而querySelectorAll返回的一個(gè)集合(NodeList)。IE8以上支持
詳見:W3C selector API
指向特定元素集合的屬性document.all :文檔中所有的元素,F(xiàn)irefox不支持該屬性。 document.forms :所有的form元素。 document.images:所有的img元素。 document.links:所有的a元素。 document.scripts:所有的script元素。 document.styleSheets:所有的link或者style元素。對(duì)象方法:
方法 | 說(shuō)明 |
---|---|
document.write() | 動(dòng)態(tài)向頁(yè)面寫入內(nèi)容 |
document.createElement(Tag) | 創(chuàng)建一個(gè)html標(biāo)簽對(duì)象 |
document.getElementById(ID) | 獲得指定ID值的對(duì)象 |
document.getElementsByTagName(tagname) | 獲得指定標(biāo)簽名的對(duì)象 |
document.getElementsByName(Name) | 獲得指定Name值的對(duì)象 |
document.getElementsByClassName(classname) | 獲得指定類名的對(duì)象(html5 API) |
getElementById(id)方法返回一個(gè)對(duì)象,該對(duì)象對(duì)應(yīng)著文檔里一個(gè)特定的元素節(jié)點(diǎn)。
getElementsByTagName()方法將返回一個(gè)對(duì)象數(shù)組,他們分別對(duì)應(yīng)著文檔里一個(gè)特定的元素節(jié)點(diǎn)
write()和writeln()方法:區(qū)別在于后者在傳送到文檔中的字符串末時(shí)附加一個(gè)回車符。
querySelector方法的參數(shù)使用CSS選擇器語(yǔ)法,getElementById方法的參數(shù)是HTML標(biāo)簽元素的id屬性。
document.querySelector("li") document.getElementById("last")
如果有多個(gè)節(jié)點(diǎn)滿足querySelector方法的條件,則返回第一個(gè)匹配的節(jié)點(diǎn)。
document.createElement()是在對(duì)象中創(chuàng)建一個(gè)對(duì)象,要與appendChild() 或 insertBefore()方法聯(lián)合使用。
其中,appendChild() 方法在節(jié)點(diǎn)的子節(jié)點(diǎn)列表末添加新的子節(jié)點(diǎn)。insertBefore() 方法在節(jié)點(diǎn)的子節(jié)點(diǎn)列表任意位置插入新的節(jié)點(diǎn)。
body-主體子對(duì)象document.body //指定文檔主體的開始和結(jié)束等價(jià)于body>/body> document.body.bgColor //設(shè)置或獲取對(duì)象后面的背景顏色 document.body.link //未點(diǎn)擊過(guò)的鏈接顏色 document.body.alink //激活鏈接(焦點(diǎn)在此鏈接上)的顏色 document.body.vlink //已點(diǎn)擊過(guò)的鏈接顏色 document.body.text //文本色 document.body.innerText //設(shè)置body>…/body>之間的文本 document.body.innerHTML //設(shè)置body>…/body>之間的HTML代碼 document.body.topMargin //頁(yè)面上邊距 document.body.leftMargin //頁(yè)面左邊距 document.body.rightMargin //頁(yè)面右邊距 document.body.bottomMargin //頁(yè)面下邊距 document.body.background //背景圖片 document.body.appendChild(oTag) //動(dòng)態(tài)生成一個(gè)HTML對(duì)象常用對(duì)象事件
document.body.onclick=”func()” //鼠標(biāo)指針單擊對(duì)象是觸發(fā) document.body.onmouseover=”func()” //鼠標(biāo)指針移到對(duì)象時(shí)觸發(fā) document.body.onmouseout=”func()” //鼠標(biāo)指針移出對(duì)象時(shí)觸發(fā)圖層對(duì)象的4個(gè)屬性
document.getElementById(”ID”).innerText //動(dòng)態(tài)輸出文本 document.getElementById(”ID”).innerHTML //動(dòng)態(tài)輸出HTML document.getElementById(”ID”).outerText //同innerText document.getElementById(”ID”).outerHTML //同innerHTML
看如下例子:
思維導(dǎo)圖hello world!你好
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/87622.html
摘要:超詳細(xì)并且?guī)У目缬蛑改蟻?lái)了本文基于你了解的同源策略,并且了解使用跨域跨域的理由。使用方法就是將符合上述條件頁(yè)面的設(shè)置為同樣的二級(jí)域名。這兩個(gè)網(wǎng)站都是協(xié)議,端口都是,且二級(jí)域名都是。 超詳細(xì)并且?guī)?Demo 的 JavaScript 跨域指南來(lái)了! 本文基于你了解 JavaScript 的同源策略,并且了解使用跨域跨域的理由。 1. JSONP 首先要介紹的跨域方法必然是 JSONP。 ...
摘要:有級(jí)級(jí)級(jí)共個(gè)級(jí)別。事件類型事件類型鼠標(biāo)事件鍵盤事件事件事件處理器執(zhí)行代碼的程序在事件發(fā)生時(shí)會(huì)對(duì)事件做出響應(yīng)。在標(biāo)簽中使用事件處理器的語(yǔ)法是標(biāo)簽事件處理器代碼事件處理程序事件就是用戶或?yàn)g覽器自身執(zhí)行的某種動(dòng)作。 DOM介紹 D(文檔)可以理解為整個(gè)Web加載的網(wǎng)頁(yè)文檔,O(對(duì)象)可以理解為類似window對(duì)象只來(lái)的東西,可以調(diào)用屬性和方法,這里我們說(shuō)的是document對(duì)象,M(模型)可...
摘要:響應(yīng)某個(gè)事件的函數(shù)就叫事件處理程序或事件偵聽器。為事件指定事件處理程序的方法主要有種。事件處理程序事件直接加在元素上。事件委托利用冒泡的原理,把事件加到父元素或祖先元素上,觸發(fā)執(zhí)行效果,解決事件處理程序過(guò)多問(wèn)題。事件委托優(yōu)點(diǎn)提高性能。 JavaScript簡(jiǎn)單入門可以看看我丑丑的Github博客JavaScript簡(jiǎn)單入門 事件 JavaScript與HTML之間的交互是通過(guò)事件實(shí)現(xiàn)的...
摘要:布爾值表示捕獲階段調(diào)用事件處理程序,表示冒泡階段通過(guò)對(duì)象的方法,也可以定義事件的回調(diào)函數(shù)。對(duì)象會(huì)被作為第一個(gè)參數(shù)傳遞給事件監(jiān)聽的回調(diào)函數(shù)。布爾默認(rèn)值是,當(dāng)設(shè)置成時(shí)用以取消事件的默認(rèn)行為與中的相同。 其實(shí)這篇文章挺早之前就寫了,但是由于sf保存方面的bug,所以當(dāng)時(shí)寫了一大堆,結(jié)果沒(méi)保存,覺(jué)得這個(gè)沒(méi)寫完是個(gè)不小的遺憾,今天正好有空,就給補(bǔ)充下了,也正好給我的javascript學(xué)習(xí)總結(jié)做...
摘要:理解的函數(shù)基礎(chǔ)要搞好深入淺出原型使用原型模型,雖然這經(jīng)常被當(dāng)作缺點(diǎn)提及,但是只要善于運(yùn)用,其實(shí)基于原型的繼承模型比傳統(tǒng)的類繼承還要強(qiáng)大。中文指南基本操作指南二繼續(xù)熟悉的幾對(duì)方法,包括,,。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。 怎樣使用 this 因?yàn)楸救藢儆趥吻岸?,因此文中只看懂?8 成左右,希望能夠給大家?guī)?lái)幫助....(據(jù)說(shuō)是阿里的前端妹子寫的) this 的值到底...
閱讀 3494·2023-04-25 21:43
閱讀 3106·2019-08-29 17:04
閱讀 807·2019-08-29 16:32
閱讀 1546·2019-08-29 15:16
閱讀 2158·2019-08-29 14:09
閱讀 2747·2019-08-29 13:07
閱讀 1633·2019-08-26 13:32
閱讀 1326·2019-08-26 12:00