国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

DOM和BOM

WelliJhon / 3012人閱讀

摘要：和概念文檔對(duì)象模型。作用操作頁(yè)面中的元素。頂級(jí)對(duì)象是就是指或者文件。側(cè)重于展示數(shù)據(jù)，側(cè)重于存儲(chǔ)數(shù)據(jù)，寫(xiě)的是代碼，遵循的是的規(guī)范。頁(yè)面中所有的內(nèi)容都是節(jié)點(diǎn)標(biāo)簽節(jié)點(diǎn)，屬性節(jié)點(diǎn)，文本節(jié)點(diǎn)。所以，對(duì)象值這種寫(xiě)法是錯(cuò)誤的。

DOM和BOM DOM 概念

DOM:Document Object Model 文檔對(duì)象模型。

DOM作用：操作頁(yè)面中的元素。

頂級(jí)對(duì)象是document 就是指HTML或者XML文件。

HTML側(cè)重于展示數(shù)據(jù)，XML側(cè)重于存儲(chǔ)數(shù)據(jù)，XHTML寫(xiě)的是HTML代碼，遵循的是XML 的規(guī)范。

每一個(gè)HTML文件都可以看成是一個(gè)文檔對(duì)象，里面所有的標(biāo)簽的層次關(guān)系都可以看成是一個(gè)樹(shù)形結(jié)構(gòu)圖，樹(shù)狀圖。

頁(yè)面中所有的內(nèi)容都是節(jié)點(diǎn)：標(biāo)簽節(jié)點(diǎn)，屬性節(jié)點(diǎn)，文本節(jié)點(diǎn)。IE8中會(huì)忽略空白節(jié)點(diǎn)

節(jié)點(diǎn)屬性

nodeType 如果是標(biāo)簽，值為1；如果是屬性，值為2；如果是文本，值為3

nodeName 如果是標(biāo)簽，值為大寫(xiě)標(biāo)簽名字；如果是屬性，值為小寫(xiě)屬性名字；如果是文本，值為#text

nodeValue 如果是標(biāo)簽，值為 null ；如果是屬性，值為屬性值；如果是文本，值為文本內(nèi)容

頁(yè)面中的標(biāo)簽，標(biāo)簽就是元素，元素就可以看成是對(duì)象，標(biāo)簽也是節(jié)點(diǎn)。

節(jié)點(diǎn)比元素大。

根元素：頁(yè)面中最外邊的標(biāo)簽

文檔元素：文檔中的第一個(gè)元素，HTML文檔元素就是< html>

綁定和解綁

第一種寫(xiě)法

對(duì)象.on+"事件名字"=事件處理函數(shù)

對(duì)象.on+"事件名字"=null

第二種寫(xiě)法

對(duì)象.addEventListener("事件名字",命名函數(shù),false);

對(duì)象.revemoEventListener("事件名字",命名函數(shù)的名字,false);

第三種寫(xiě)法

對(duì)象.attachEvent("事件名字",命名函數(shù));

對(duì)象.detachEvent("事件名字",命名函數(shù)的名字);

事件冒泡

元素A中嵌套了另一個(gè)元素B，里面元素B和外面元素A注冊(cè)了相同的事件，如果里面元素B的事件觸發(fā)了，外面的元素A的該事件也會(huì)自動(dòng)的觸發(fā)。

阻止事件冒泡的兩種方法 window.event.cancelBubble=true 或者是 e.stopPropagation();

事件的三個(gè)階段

事件捕獲階段，事件目標(biāo)階段，事件冒泡階段

事件階段有一個(gè)屬性，這個(gè)屬性是需要通過(guò)事件參數(shù)對(duì)象.eventPhase來(lái)獲取的

屬性的值是：1->捕獲階段2->目標(biāo)階段3->冒泡階段

e.type獲取的是當(dāng)前觸發(fā)該事件的事件類型

false值由內(nèi)向外，一般采用false

dv3===2===click

dv2===3===click

dv1===3===click

true值由外向內(nèi)

dv1===1===click

dv2===1===click

dv3===2===click

DOM級(jí)別

DOM0 初級(jí)階段

DOM1 規(guī)定了節(jié)點(diǎn)的類型Node，一般使用DOM1

DOM2 新增了一些方法，但是很多瀏覽器并不支持

DOM3 大多數(shù)瀏覽器都沒(méi)有支持

全局變量和隱式全局變量

全局變量不會(huì)被刪除，隱式全局變量會(huì)被刪除

innerText和innerHTML

設(shè)置文本內(nèi)容的時(shí)候，用兩個(gè)都一樣

設(shè)置標(biāo)簽內(nèi)容的時(shí)候

innerText設(shè)置標(biāo)簽內(nèi)容，顯示的是標(biāo)簽+文本，標(biāo)簽實(shí)際上是轉(zhuǎn)義出來(lái)了

innerHTML設(shè)置標(biāo)簽內(nèi)容，顯示的是效果

如果想要設(shè)置文本，用誰(shuí)都可以，如果想要有標(biāo)簽效果，用innerHTML

獲取標(biāo)簽中的文本內(nèi)容，使用innerText和innerHTML都可以，如果獲取的是元素中的標(biāo)簽和文本內(nèi)容，應(yīng)該使用innerHTML

innerText和textContent

innerText：谷歌支持，低版本火狐不支持，高版本火狐支持，IE8支持

textContent：谷歌支持，火狐支持，IE8不支持

瀏覽器不支持某屬性時(shí)，該屬性的類型是undefined

className

html標(biāo)簽中的class屬性，在js 中是關(guān)鍵字，不能直接使用。所以， 對(duì)象.class="值"; 這種寫(xiě)法是錯(cuò)誤的。應(yīng)該這么寫(xiě)：對(duì)象.className="值";

對(duì)象.style.屬性名="值"; div.style.backgroundColor="red";

對(duì)象.className="值"; div.className="cls";

自定義屬性

獲取自定義屬性的值 對(duì)象.getAttribute(“屬性的名字”); 返回值是該屬性的值

設(shè)置自定義屬性的值 對(duì)象.setAttribute(“屬性的名字”,”值”);

removeAttribute，getAttribute，setAttribute三個(gè)方法不僅可以操作元素的自定義屬性及值，還可以操作元素的自帶屬性

隱藏方式
設(shè)置樣式

如果樣式的屬性是在style屬性中設(shè)置的，是可以直接獲取的

如果樣式的屬性是在style標(biāo)簽中設(shè)置的，不能直接獲取

獲取節(jié)點(diǎn)元素12個(gè)
創(chuàng)建元素的三種方式

第一種document.write

第二種 對(duì)象.innerHTML=”標(biāo)簽代碼及內(nèi)容”

第三種 document.creatElement

定時(shí)器 setInterval()

參數(shù)：代碼

參數(shù)：時(shí)間----1000毫秒---1秒

返回值：該定時(shí)器的id值

執(zhí)行過(guò)程：當(dāng)頁(yè)面加載完畢后，過(guò)了一段時(shí)間才執(zhí)行里面的代碼，再過(guò)一段時(shí)間再次里面的代碼，反復(fù)執(zhí)行

clearInterval(timeId);//清理定時(shí)器

setTimeout()

參數(shù)：代碼

參數(shù)：時(shí)間----1000毫秒---1秒

返回值：該定時(shí)器的id值

執(zhí)行過(guò)程：當(dāng)頁(yè)面加載完畢后，過(guò)了一段時(shí)間才執(zhí)行里面的代碼，再過(guò)一段時(shí)間再次里面的代碼，只執(zhí)行一次

clearTimeout(timeId2);//清理定時(shí)器

三大系列 offset系列

offsetLeft：元素相對(duì)左邊的橫坐標(biāo)

offsetTop：元素相對(duì)上面的縱坐標(biāo)

offsetWidth：元素的寬度，有邊框

offsetHeight：元素的高度，有邊框

offset系列獲取的值都是數(shù)字類型

offsetWidth（offsetHeight）獲取的元素本身的寬（高）+元素邊框的寬（高）

如果父級(jí)元素脫離文檔流，子級(jí)元素此時(shí)的offsetLeft獲取的是相對(duì)父級(jí)元素的pading+自己的margin

如果元素自己脫離文檔流，此時(shí)的offsetLeft獲取的事自己的left+自己的margin

scroll系列

scrollLeft：向左卷曲出去的橫坐標(biāo)

scrollTop：向上卷曲出去的縱坐標(biāo)

scrollWidth：內(nèi)容實(shí)際的寬度，沒(méi)有內(nèi)容就是元素的寬度，沒(méi)有邊框

scrollHeight：內(nèi)容實(shí)際的高度，沒(méi)有內(nèi)容就是元素的高度，沒(méi)有邊框

client系列

clientX：可視區(qū)域的橫坐標(biāo)

clientY：可視區(qū)域的縱坐標(biāo)

clientWidth：可視區(qū)域的寬

clientHeight：可視區(qū)域的高

BOM 概述

瀏覽器中的頂級(jí)對(duì)象window，頁(yè)面中的頂級(jí)對(duì)象document

頁(yè)面中所有的內(nèi)容都是window的，變量是屬于window的，函數(shù)是屬于window的。

因?yàn)轫?yè)面中所有的內(nèi)容都是window，所以，window是可以省略不寫(xiě)的。

系統(tǒng)對(duì)話框

alert() //不同瀏覽器中的外觀是不一樣的

confirm();//true確定,false取消

prompt() //不推薦使用

窗口對(duì)象

Window.open() 打開(kāi)窗口

參數(shù)1:地址(內(nèi)部的地址,外部的地址)

參數(shù)2:打開(kāi)的方式：self 是在當(dāng)前的頁(yè)面中打開(kāi)，blank是在新的選項(xiàng)卡中打開(kāi)

參數(shù)3:好多的代碼

window.close() 關(guān)閉窗口

Window.location對(duì)象

location相當(dāng)于瀏覽器地址欄，可以將url解析成獨(dú)立的片段

Window.navigator對(duì)象

window.navigator 的一些屬性可以獲取客戶端(瀏覽器)的一些信息：

userAgent用戶當(dāng)前瀏覽器信息

platform用戶系統(tǒng)信息（不準(zhǔn)確）

Window.history對(duì)象

歷史記錄管理：

后退：history.back() history.go(-1)

前進(jìn)：history.forward() history.go(1)

操作之后生成歷史記錄

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/113870.html

相關(guān)文章

  • kmdjs和循環(huán)依賴

    摘要：從很早的版本就開(kāi)始，是支持循環(huán)依賴的。比如下面的代碼會(huì)被編譯成要支持循環(huán)依賴其實(shí)有個(gè)要求，就是。不是的循環(huán)依賴是無(wú)解的循環(huán)依賴。所以在初始化階段，這樣的循環(huán)依賴是被允許的，因?yàn)槎际恰? 循環(huán)依賴 循環(huán)依賴是非常必要的，有的程序?qū)懼鴮?xiě)著就循環(huán)依賴了，可以提取出一個(gè)對(duì)象來(lái)共同依賴解決循環(huán)依賴，但是有時(shí)會(huì)破壞程序的邏輯自封閉和高內(nèi)聚。所以沒(méi)解決好循環(huán)依賴的模塊化庫(kù)、框架、編譯器都不是一個(gè)好庫(kù)、...

    AlienZHOU 評(píng)論0 收藏0

  • JavaScript的組成 | DOM/BOM

    摘要：中主要關(guān)注的就是，對(duì)象的主要功能就是處理網(wǎng)頁(yè)內(nèi)容。中文翻譯模型，如果你把這個(gè)詞從中抽離出來(lái)，看下面的圖片是不是就很好理解。年月制定的標(biāo)準(zhǔn)，由兩大部分組成核心和。擴(kuò)展鼠標(biāo)和用戶界面事件范圍遍歷，增加了對(duì)支持。 往期回顧 在上一期的《JavaScript的組成 | 核心-ECMAScript 》?里，我們有說(shuō)到JavaScript 是由三大部分組成，分別是：核心ECMAScript、文檔對(duì)...

    worldligang 評(píng)論0 收藏0

  • 談?wù)劄g覽器里的JavaScript

    摘要：而與最大的區(qū)別在于與瀏覽器溝通的窗口，不涉及網(wǎng)頁(yè)內(nèi)容。完全依賴于瀏覽器廠商實(shí)作本身無(wú)標(biāo)準(zhǔn)規(guī)范，而有著所制定的標(biāo)準(zhǔn)來(lái)規(guī)范。而透過(guò)選取出來(lái)的節(jié)點(diǎn)，我們可以通過(guò)操作屬性來(lái)變更它的文字。在許多的網(wǎng)頁(yè)前端教學(xué)或是文章書(shū)籍當(dāng)中，你可能常常聽(tīng)到這樣的說(shuō)法：「HTML、CSS 與JavaScript 是網(wǎng)頁(yè)前端三大要素」，其中： HTML 負(fù)責(zé)資料與結(jié)構(gòu) CSS 負(fù)責(zé)樣式與呈現(xiàn) JavaScript 負(fù)責(zé)...

    CastlePeaK 評(píng)論0 收藏0

  • JavaScript學(xué)習(xí)總結(jié)（三）BOM和DOM詳解

    摘要：有級(jí)級(jí)級(jí)共個(gè)級(jí)別。事件類型事件類型鼠標(biāo)事件鍵盤(pán)事件事件事件處理器執(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（模型）可...

    littlelightss 評(píng)論0 收藏0

  • 《JavaScript 闖關(guān)記》之簡(jiǎn)介

    摘要：瀏覽器只是實(shí)現(xiàn)的宿主環(huán)境之一，其他宿主環(huán)境包括和。年月，版發(fā)布，成為國(guó)際標(biāo)準(zhǔn)。事件定義了事件和事件處理的接口。對(duì)于已經(jīng)正式納入標(biāo)準(zhǔn)的來(lái)說(shuō)，盡管各瀏覽器都實(shí)現(xiàn)了某些眾所周知的共同特性，但其他特性還是會(huì)因?yàn)g覽器而異。 JavaScript 是面向 Web 的編程語(yǔ)言，絕大多數(shù)現(xiàn)代網(wǎng)站都使用了 JavaScript，并且所有的現(xiàn)代 Web 瀏覽器（電腦，手機(jī)，平板）均包含了 JavaScri...

    baihe 評(píng)論0 收藏0

  • 做一名精致的JavaScripter 01：JavaScript簡(jiǎn)介

    摘要：精致從細(xì)節(jié)做起。標(biāo)準(zhǔn)會(huì)在每年的月發(fā)布一次，作為當(dāng)年的正式版本，便是年發(fā)布的正式版本。支持情況各大瀏覽器對(duì)的支持情況瀏覽器支持情況對(duì)的支持情況支持情況。在瀏覽器中基于實(shí)現(xiàn)的已經(jīng)成為的重要組成部分。 精致從細(xì)節(jié)做起。前端的工作也有一段時(shí)間了，大大小小的前端框架都有接觸過(guò)，越是深入學(xué)習(xí)越是感覺(jué)之前的學(xué)習(xí)過(guò)于粗糙，基礎(chǔ)不夠扎實(shí)，于是準(zhǔn)備近期把JavaScript的基礎(chǔ)知識(shí)點(diǎn)梳理一下，查缺補(bǔ)漏，...

    張巨偉 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<