海報:
通過《DOM啓濛》,讀者將學習如何通過文檔對象模型(DOM)更有效率地操作HTML,而無需DOM操作庫的幫助。作者CodyLindley(jQuery手冊)用菜譜風格的代碼示例,用演示多種節點對象的工作方式,帶你領略現代DOM理念。在過去的十年裏,框架簡化瞭DOM的用法,後者因此被開發者塵封在前者之下。本書通過現代瀏覽器原生的概念與代碼,將這些工具帶迴視綫。讀者將理解jQuery在DOM腳本編寫中扮演的角色,並學習如何在移動應
用和特定瀏覽器中直接使用DOM編寫應用程序。
陳養劍,男,畢業於浙江。大學軟件工程係,現就職於阿裏媽媽用戶體驗部門,擔任前端工程師有三年餘,負責創意及相關工具與服務開發。
“DouglasCrockford在他的《JavaScript語言精粹》一書中給過我們一張理解JavaScript語言內部工作機製的示意圖。現在CodyLindley給瞭我們一張對應文檔對象模型。”
——JeremyKeithClearleft.com創始人與技術總監,《DOM腳本編寫》作者
前言
序言
第1 章 節點概覽
11 文檔對象模型(Document Object Model,亦稱 DOM)是個由JavaScript
節點對象組成的層次結構/ 樹
12 節點對象類型
13 繼承自節點對象的子節點對象
14 用於與節點打交道的屬性與方法
15 識彆節點的類型與名稱
16 獲取節點的值
17 使用 JavaScript 方法來創建元素與文本節點
18 使用 JavaScript 字符串創建並嚮DOM 中添加元素與文本節點
19 提取DOM 樹中的部分作為JavaScript 字符串
110 使用 appendChild() 與 insertBefore() 嚮DOM 中插入節點對象
111 使用 removeChild() 與 replaceChild() 來移除與替換節點
112 使用 cloneNode() 來復製節點
113 理解節點集閤(即 NodeList 與 HTMLCollection)
114 獲取所有直屬子節點的列錶/ 集閤
115 將 NodeList 或者 HTMLCollection 轉換成JavaScript 數組
116 遍曆 DOM 中的節點
117 使用 contains() 與 compareDocumentPosition() 驗證節點在 DOM 樹中的
位置
118 判斷兩個節點是否相同
第2 章 文檔節點
21 文檔節點概覽
22 HTML 文檔屬性與方法(包括繼承的)
23 獲取 HTML Document 通用信息(標題、鏈接、提及者、最後修改時間
及兼容模式)
24 文檔子節點
25 document 提供的 <!DOCTYPE>、<html lang="en">、<head> 及 <body>
捷徑
26 使用 documentimplementationhasFeature() 探測 DOM 規範/ 特性
27 獲取文檔中當前聚焦/ 激活節點的引用
28 判斷文檔或者文檔中任何節點得到焦點
29 documentdefaultView 是個到頂部/ 全局對象的捷徑
210 使用 ownerDocument 從某一元素取得文檔的引用
第3 章 元素節點
31 HTML*Element 對象概覽
32 HTML*Element 對象屬性與方法(包括繼承的)
33 創建元素
34 獲取元素的標簽名
35 獲取元素屬性與值的列錶/ 集閤
36 獲取、設置及移除元素的屬性值
37 驗證元素是否有某一特定屬性
38 獲取類屬性值列錶
39 添加與移除類屬性中的部分值
310 變換某個類屬性值
311 判斷類屬性值是否含有某一特定值
312 獲取與設置 data-* 屬性
第4 章 元素節點選取
41 選取特定元素節點
42 選取/ 創建一個元素節點列錶(即 NodeList)
43 選取所有的直屬子元素節點
44 選取與上下文有關的元素
45 預定義的元素節點選取/ 列錶
46 使用 matchesSelector() 驗證元素會否被選取
第5 章 元素節點幾何量與滾動幾何量
51 元素節點尺寸、偏移及滾動概覽
52 獲取元素相對於 offsetParent 的 offsetTop 及 offsetLeft 值
53 使用 getBoundingClientRect() 獲取元素相對於視區的Top, Right, Bottom
及Left 邊沿偏移量
54 獲取元素在視區中的尺寸(邊框 + 填充 + 內容)
55 獲取元素在視區中的尺寸(填充 + 內容),不含邊框
56 使用 elementFromPoint() 獲取視區中某一特定點上最頂層的元素
57 使用 scrollHeight 及 scrollWidth 獲取滾動元素的尺寸
58 使用 scrollTop 及scrollLeft 獲取並設置從上、左邊滾動的距離
59 使用 scrollIntoView() 滾動元素到視區
第6 章 元素節點內聯樣式
61 樣式屬性(亦稱元素內聯 CSS 屬性)概覽
62 獲取、設置及移除單個內聯 CSS 屬性
63 獲取、設置及移除所有內聯 CSS 屬性
64 使用 getComputedStyle() 獲取元素的已計算樣式(即包含任何級聯樣式的
實際樣式)
65 使用 class 及 id 屬性應用或者移除元素上的 CSS 屬性
第7 章 文本節點
71 文本對象概覽
72 文本對象與屬性
73 空白符創建文本節點
74 創建與注入文本節點
75 使用 data 或 nodeValue 獲取文本節點值
76 使用appendData()、deleteData()、insertData()、replaceData() 及
subStringData() 操作文本節點
77 當有多個兄弟文本節點時
78 使用 textContent 移除文本標記並返迴所有的子文本節點
79 textContent 與 innerText 的區彆
710 使用 normalize() 閤並兄弟文本節點成單個文本節點
711 使用 splitText() 分割文本節點
第8 章 DocumentFragment 節點
81 DocumentFragment 對象概覽
82 使用 createDocumentFragment() 創建 DocumentFragment
83 添加 DocumentFragment 到實時 DOM
84 使用文檔片段上的 innerHTML
85 通過復製將片段所含節點保留在內存中
第9 章 CSS 樣式錶與 CSS 規則
91 CSS 樣式錶概覽
92 訪問 DOM 中所有樣式錶(即 CSSStyleSheet 對象)
93 CSSStyleSheet 屬性與方法
94 CSSStyleRule 概覽
95 CSSStyleRule 屬性與方法
96 使用 cssRules 獲取樣式錶內的 CSS 規則列錶
97 使用 insertRule() 和 deleteRule() 來插入與刪除樣式錶中的 CSS 規則
98 使用 style 屬性修改 CSSStyleRule 的值
99 創建新的內聯 CSS 樣式錶
91 0 以編程方式添加外部樣式錶到 HTML 文檔
91 1 用 disabled 屬性使樣式錶失效/ 生效
第10 章 DOM 中的 JavaScript
101 插入與執行 JavaScript 概覽
102 JavaScript 默認同步解析
103 使用 defer 推遲外部腳本的下載與執行
104 使用 async 異步下載並執行外部JavaScript 文件
105 使用動態 <script> 元素強製異步加載並解析外部 JavaScript
106 通過給異步 <script> 加 onload 迴調從而知道它們何時加載完畢
107 注意含有 DOM 操作的 <script> 的放置
108 獲取 DOM 中 <script> 列錶
第11 章 DOM 事件
111 DOM 事件概覽
112 DOM 事件類型
113 事件流程
114 添加事件監聽函數到Element 節點、window 對象及document 對象
115 移除事件監聽函數
116 從事件對象中獲取事件屬性
117 使用 addEventListener() 時監聽函數中 this 的值
118 事件調用時取得事件模闆而不是所綁定的節點或對象
119 使用 preventDefault() 撤銷瀏覽器默認事件
1110 使用 stopPropagation() 終止事件流程
1111 使用 stopImmediatePropagation() 終止事件流程與相同目標上的其他
事件
1112 自定義事件
1113 模擬/ 觸發鼠標事件
1114 事件委托
第12 章 創作domjs :源自jQuery 的靈感,服務於現代
瀏覽器,這是一個萬眾期待的DOM 庫
121 domjs 概覽
122 創建唯一作用域
123 創建 dom() 與 GetOrMakeDom(),全局暴露 dom() 與 GetOrMakeDom
prototype
124 創建傳給 dom() 的可選上下文參數
125 依據 params 産生一個持有 DOM 節點引用的對象並返迴
126 創建 each() 方法並使它可鏈式調用
127 創建 html()、append() 及 text() 方法
128 拉 domjs 齣來兜兜風
129 總結與 domjs 繼續
我創建網站。有時我也創作音樂。多年來,我在有些自認為是創作型的音樂傢那裏——經常是自學的——注意到一個有趣的行為模式:他們抵觸學習任何音樂理論。他們認為,從邏輯上來說,知曉音樂背後的理論會莫名限製他們的創作能力。我從來搞不懂這邏輯(並且我私下認為這是因鬆懈而找的藉口)。依我看,我不覺得任何知識或者啓濛會是壞事。
唉,我在Web設計領域也看到瞭類似的邏輯。有些設計師不僅不知道如何寫HTML與CSS,而且他們堅決拒絕學習。同樣的,他們害怕這些知識會在某種程度上限製自己(同樣的,我認為這是個自證的藉口)。
幸運的是這種態度在前端開發領域還不流行。大多數Web開發者明白學無止境,但就算是對HTML與CSS知識有百科全書般全麵認知的開發者,在涉及文檔對象模型(DocumentObjectModel)時仍會有知識差距。這情有可原。如果用瞭類似jQuery的庫,你不需要懂得DOM內部工作機製。JavaScript庫的意義就在於抽離開瀏覽器內部的API,並轉而提供一個不同的、更好的API。
盡管如此,我認為許多前端開發者覺得他們應該知道錶麵之下都發生瞭什麼。這是一個優秀極客遇到他們工作所需係統的自然反應。現在,感謝《DOM啓濛》,他們可以一解心頭之癢瞭。
道格拉斯?剋羅剋福德在他的書《JavaScript語言精粹》中給瞭我們理解JavaScript語言內部機製的圖譜。現在科迪?林得利也給瞭文檔對象模型的相應圖譜。以此圖譜為武裝,你就獲得瞭指引DOM通路與隧道所需的知識。
你或許不能在每個項目中都運用到這些知識,或許選擇改用諸如jQuery的類庫,但此時就任君抉擇瞭。與其因所知有限必須使用某個類庫,不如擁有是否以及何時使用jQuery的決定權。這是種大權在握的感覺,全憑所知所學提供,是真正的啓濛所指。
——傑裏米·基思,clearleft。com的創始人與技術監督
《JavaScriptDOM編程藝術》一書的作者
我必須承認,在接觸《DOM啓濛》之前,我對待DOM的態度,就像對待一個龐大而復雜的迷宮,總是在裏麵小心翼翼地摸索,生怕走錯一步就“團滅”。各種節點、屬性、方法…… 一大堆名詞和API,看得我頭大。這本書的優點在於,它沒有讓我感到被信息淹沒。它就像一個經驗豐富的嚮導,一步步地帶領我走入這個迷宮,而且不是那種硬塞給你地圖,而是讓你邊走邊學,逐漸熟悉每一個轉角和捷徑。它巧妙地將DOM的各個方麵串聯起來,讓我明白它們之間的內在聯係,而不是孤立地記憶。從如何創建和插入元素,到如何遍曆和修改,再到如何處理用戶交互,每一個部分都講解得有條理,有重點。尤其令我印象深刻的是,書中對DOM操作的“副作用”進行瞭細緻的分析,讓我意識到一些看似微小的操作,在大量執行時可能會帶來意想不到的性能問題。這本書讓我不再畏懼DOM,而是能夠自信地運用它來構建更具響應性和交互性的網頁。
評分我當初買《DOM啓濛》純屬偶然,但沒想到它卻成為瞭我學習前端開發過程中一個不可或缺的“寶藏”。在我的印象中,DOM就像是網頁背後那個沉默而強大的“管傢”,負責一切元素的增刪改查,以及響應用戶的每一次點擊、滾動。但過去,我總是覺得自己在跟這個“管傢”打交道時,溝通不夠順暢,總會遇到一些莫名其妙的“bug”。這本書就像是翻譯官,用最清晰易懂的語言,幫我 decipher 瞭這個“管傢”的語言。它並沒有一開始就堆砌各種API,而是從構建DOM樹的原理講起,讓我明白每個元素在樹狀結構中的位置和關係。然後,它循序漸進地講解如何通過JavaScript去“找到”這些元素,如何“改變”它們的外觀和內容,以及如何“響應”用戶的行為。書中那些關於性能優化的章節,更是讓我眼前一亮。之前我總是為瞭實現某個功能而犧牲性能,現在我明白瞭如何在使用DOM的同時,也能保證頁麵的流暢運行,這絕對是提升用戶體驗的關鍵。它不是那種速成類的書籍,而是真正幫助我建立起紮實的DOM基礎,為我後續深入學習前端框架打下瞭堅實的地基。
評分說起來,《DOM啓濛》這本書,對於我這樣的前端小白來說,簡直是雪中送炭。我之前學習JavaScript,感覺就像在學一門全新的語言,語法、邏輯都得從頭開始。而DOM,又像是這門語言中最具象、最實用的一個分支,但又好像總有一層窗戶紙隔著,讓我看不透。這本書做得特彆好的一點是,它從最基礎的“什麼是DOM”開始,然後一步步構建起來,就像搭積木一樣,讓我能夠清晰地看到每一個部分是如何組裝到一起的。它沒有使用過多晦澀難懂的術語,而是盡量用通俗易懂的語言來解釋每一個概念。我特彆喜歡書中講解如何動態創建和刪除元素的章節,這些都是非常基礎但又至關重要的操作。而且,它還穿插瞭一些關於如何讓你的DOM操作更“優雅”、更“高效”的小貼士,讓我覺得這本書不僅僅是教會我“怎麼做”,更教會我“怎麼做得更好”。讀完這本書,我感覺自己對網頁的構成和交互有瞭更深刻的理解,不再是那個隻會跟著教程敲代碼的小白瞭。
評分這本《DOM啓濛》絕對是前端開發者的一場及時雨!我一直覺得DOM操作就像是網頁開發中的“筋骨”,雖然基礎,但要做到精通卻著實不易。市麵上關於JavaScript的書籍不少,但很多都側重於語言本身的語法和高級特性,對於如何巧妙、高效地操縱DOM,以實現流暢的用戶交互,往往語焉不詳。這本書的齣現,恰好填補瞭這一空白。它沒有直接拋齣枯燥的概念,而是從最貼近實際應用的角度齣發,一步步引導讀者理解DOM的本質。我特彆喜歡它在講解過程中使用的那些生動形象的比喻,比如把DOM比作一棵倒置的樹,瞬間就讓原本抽象的概念變得觸手可及。而且,書中對事件委托、DOM渲染優化等這些在實際項目中至關重要的技巧,都進行瞭深入淺齣的剖析,讓我受益匪淺。特彆是那些代碼示例,都非常貼閤實際開發場景,並且有詳細的解釋,讓我不僅知道“怎麼做”,更理解瞭“為什麼這麼做”。讀完這本書,我感覺自己在前端開發的內功上有瞭質的飛躍,現在麵對復雜的交互需求,心裏更有底氣瞭。
評分實話講,作為一個入瞭行幾年的前端,我對DOM的理解一直停留在“夠用就好”的層麵。你知道怎麼添加class,怎麼獲取元素,怎麼設置樣式,但你說讓我深入講講事件循環是如何影響DOM操作的,或者 gimana 最小化重排重繪,我腦子裏可能隻有一團漿糊。這本《DOM啓濛》的齣現,就像一道光,照亮瞭我之前模糊不清的認知盲區。它不是那種隻告訴你“怎麼做”的書,更重要的是它在解釋“為什麼這麼做”。比如,它詳細剖析瞭不同DOM方法的內部機製,讓我理解瞭為什麼有些方法效率更高,而另一些則可能導緻性能瓶頸。書中的案例設計也非常精妙,很多場景都是我在實際項目中會遇到的,但之前可能都是靠“感覺”去解決。現在,我能夠有理有據地去分析問題,找到最優的解決方案。尤其是關於DOM事件模型和冒泡/捕獲的講解,讓我茅塞頓開,再也不會被那些看似復雜的事件處理邏輯搞得暈頭轉嚮。這本書真的讓我從一個“DOM使用者”進化成瞭一個“DOM理解者”。
評分特彆特彆的好
評分在過去的十年裏,框架簡化瞭DOM的用法,後者因此被開發者塵封在前者之下。《DOM啓濛》通過現代瀏覽器原生的概念與代碼,將這些工具帶迴視綫。讀者將理解jQuery在DOM腳本編寫中扮演的角色,並學習如何在移動應用和特定瀏覽器中直接使用DOM編寫應用程序。
評分特彆特彆的好
評分代彆人購買,反饋說不錯。
評分還行吧動物書,就是價格感人
評分還行吧動物書,就是價格感人
評分對與dom操作有很好的講解,是一本經典的好書
評分想想都有瞭jquery,還看這個乾啥,要是不用jquery,這是本很不錯的書
評分很好,很強大,很強大,很強大,很。。。強,很。。大
本站所有內容均為互聯網搜尋引擎提供的公開搜索信息,本站不存儲任何數據與內容,任何內容與數據均與本站無關,如有需要請聯繫相關搜索引擎包括但不限於百度,google,bing,sogou 等
© 2025 book.cndgn.com All Rights Reserved. 新城书站 版權所有