當(dāng)前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
笔记《javascript高级程序设计》 第12章 DOM2和DOM3
生活随笔
收集整理的這篇文章主要介紹了
笔记《javascript高级程序设计》 第12章 DOM2和DOM3
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
DOM2 級(jí)核心：在 1 級(jí)基礎(chǔ)上構(gòu)建，為節(jié)點(diǎn)添加更多方法和屬性 DOM2 級(jí)視圖：為文檔定義了基于樣式信息的不同視圖 DOM2 級(jí)事件：說明了如何使用事件和DOM文檔交互 DOM2 級(jí)樣式：如何以編程方式來訪問和改變CSS樣式信息 DOM2 級(jí)遍歷和范圍：引入了遍歷DOM文檔和選擇其特定部分的新接口 DOM2 級(jí)HTML：添加了更多屬性、方法和新接口 12.1 DOM變化 DOM2 級(jí)和3級(jí)的目的在于擴(kuò)展DOM API，滿足操作XML的所有需求，同時(shí)提供更好的錯(cuò)誤處理及特性檢測(cè)能力。 12.1.2 其它方面的變化 1.DocumentType 類型變化 新增3個(gè)屬性：publicID、systemID 表示的是文檔類型聲明中的兩個(gè)信息段，在DOM1中無法訪問 internalSubset ? ， 用于訪問包含在文檔類型聲明中的額外定義 2.Document 類型的變化 importNode（） 用途：從一個(gè)文檔中取得一個(gè)節(jié)點(diǎn)，然后將其導(dǎo)入另一個(gè)文檔。 ? 如果調(diào)用appendChild（）在不同文檔中傳入節(jié)點(diǎn)會(huì)出錯(cuò) 接受兩個(gè)參數(shù)：要復(fù)制的節(jié)點(diǎn)和一個(gè)表示是否復(fù)制子節(jié)點(diǎn)的布爾值。返回的結(jié)果是原來節(jié)點(diǎn)的副本，但能夠在文檔中使用 3.Node類型的變化 isSupported（）
?
isSameNode（） isEqualNode（）?
4.框架的變化 12.2 樣式 12.2.1 ? 訪問元素的樣式 style 可以獲取和設(shè)置html元素style特性指定的所有樣式信息，但不包含與外部樣式表或嵌入樣式表經(jīng)層疊而來的樣式。 對(duì)于使用短劃線的css屬性名，必須將其轉(zhuǎn)換為駝峰大小寫形式 1.DOM樣式屬性和方法 在提供元素 的style特性值時(shí)，也可修改樣式 cssText：訪問style特性中的css代碼（寫入模式，以前通過style設(shè)定的樣式信息全將丟失） length：應(yīng)用給元素的css屬性的數(shù)量 parentRule：表示CSS信息的CSSRule對(duì)象 getPropertyCSSValue（propertyName）：返回包含給定屬性值的CSSValue對(duì)象 getPropertyPriority（propertyName）：如果給定的屬性使用了!important設(shè)置，則返回 “important”，否則，返回空 gePropertyValue（propertyName）：返回給定屬性的字符串值 item（index）：返回給定位置的css屬性的名稱 removeProperty（propertyName）：從樣式中刪除給定屬性 setProperty（propertyName,value,priority）：將給定屬性設(shè)置為相應(yīng)的值，并加上優(yōu)先權(quán)標(biāo)志( !important ?或 ? 一個(gè)空字符串) 2.計(jì)算的樣式- document.defaultView.getComputedStyle（mydiv，:after / null） —— 此方法在IE9 以下瀏覽器中無法生效
- 在IE8及以下中可使用 ?.currentStyle ?屬性，來獲取當(dāng)前元素的樣式
?
?
混雜模式、標(biāo)準(zhǔn)模式下，scrollWidth、clientWidth、document.documentElement.scrollWidth、document.body.scrollWidth
?
對(duì)于混雜模式下IE 需要用?document.body代替document.documentElement
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><style>.testscroll{ width: 2000px; height: 1500px; background: #C0C0C0;}</style></head><body><div class="testscroll" id="adiv"></div><script>var adiv = document.getElementById("adiv");console.log("scrollWidth:"+document.documentElement.scrollWidth);console.log("scrollHeight:"+document.documentElement.scrollHeight);console.log("clientWidth:"+document.documentElement.clientWidth);console.log("clientHeight:"+document.documentElement.clientHeight);function getWin(){var mode = document.compatMode ;// 是否處于標(biāo)準(zhǔn)模式if(mode == "CSS1Compat"){// 疑問：是不是現(xiàn)在瀏覽器版本變高，然后都同步了？// 我測(cè)試過程中，谷歌、火狐、IE里clientWidth取到的都是視口寬度，書上說的谷歌scrollWidth為視口寬度alert("可視區(qū)域?qū)挾葹?"+document.documentElement.clientWidth);alert("可視區(qū)域高度為："+document.documentElement.clientHeight);// 由于瀏覽器之間存在差異，以scrollWidth和clientWidth中求大值最靠譜var docWin = Math.max(document.documentElement.scrollWidth,document.documentElement.clientWidth);var docHei = Math.max(document.documentElement.scrollHeight,document.documentElement.clientHeight);alert("標(biāo)準(zhǔn)模式下文檔的寬度："+docWin);alert("標(biāo)準(zhǔn)模式下文檔的寬度："+docHei);}// 是否處于混雜模式else if(mode == "BackCompat"){var docWin = Math.max(document.body.scrollWidth,document.body.clientWidth);var docHei = Math.max(document.body.scrollHeight,document.body.clientHeight);alert("混雜模式下文檔的寬度："+docWin);alert("混雜模式下文檔的寬度："+docHei);}}window.onload = function(){getWin();}</script></body> </html>
轉(zhuǎn)載于:https://www.cnblogs.com/fighxp/p/6269363.html
總結(jié)
以上是生活随笔為你收集整理的笔记《javascript高级程序设计》 第12章 DOM2和DOM3的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： EDA技术使用教程实验
- 下一篇： Spring中配置Hibernate事务