DOM, BOM & JQuery
最后更新于：2022-04-01 10:30:29
## DOM, BOM & JQuery
>**DOM** - 文档对象模型(DOM)用于代表和对象交互的HTML, XHTML 和 XML 文档, 是一种跨平台和语言无关性的约定. 每一份文档的所有节点被组织成一种树结构, 称为 DOM 树. DOM 对象通过使用对象上的方法被处理和操作, 一个 DOM 对象的公共接口被指定为它的应用程序编程接口(API). - wikipedia.org
>**BOM** - 浏览器对象模型(BOM)是一种浏览器规范, 代指 Web 浏览器暴露出的对象. 与文档对象模型不同的是, 目前并没有关于浏览器对象模型的标准和严格定义, 因而浏览器厂商可以按照他们的意愿, 采取任何方式来实现 BOM. - wikipedia.org
>**JQuery** - JQuery 是一个跨平台的 JavaScript 库, 其设计目的是简化客户端的 HTML 脚本操作. JQuery 也是目前最流行的 JavaScript 库, 在目前排名前1000万的网站中, 65% 的网站安装了 JQuery. JQuery 是免费的, 基于 MIT 协议的开源软件. - wikipedia.org
最理想但又难度最大的学习路径就是首先学习 JavaScript, 然后学习 DOM, 之后再学习 JQuery. 然后, 完全可以按照你所想的学习路径来安排学习的顺序. 大多数的前端开发者在了解 JavaScript 和 DOM 之后, 才会接触 JQuery. 无论采取什么学习路径, 都要确保 JavaScript, DOM 或者 JQuery 不要成为"黑盒子".
**综合学习:**
<ul>
<li><a href="http://eloquentjavascript.net/13_dom.html" target="_blank">The Document Object Model</a> [read]</li>
<li><a href="https://www.codecademy.com/tracks/jquery" target="_blank">codecademy.com jQuery</a> [watch]</li>
<li><a href="http://jqueryenlightenment.com/" target="_blank">jQuery Enlightenment</a> [read]</li>
<li><a href="http://www.pluralsight.com/courses/jquery-getting-started" target="_blank">jQuery: Getting Started</a> [watch][$]</li>
</ul>
**精通:**
<ul>
<li><a href="http://www.amazon.com/DOM-Enlightenment-Cody-Lindley/dp/1449342841/" target="_blank">DOM Enlightenment</a> [read][$] or <a href="http://domenlightenment.com/" target="_blank">read online for free</a></li>
<li><a href="https://frontendmasters.com/courses/javascript-jquery-dom/" target="_blank">Advanced JS Fundamentals to jQuery & Pure DOM Scripting</a> [watch][$]</li>
<li><a href="http://www.amazon.com/gp/product/1590598563/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=1590598563&linkCode=as2&tag=fronenddevejo-20&linkId=VQZU5EQIQQXCF56Y" target="_blank">AdvancED DOM Scripting: Dynamic Web Design Techniques</a> [read][$]</li>
<li><a href="http://www.pluralsight.com/courses/fixing-common-jquery-bugs" target="_blank">Fixing Common jQuery Bugs</a> [watch][$]</li>
<li><a href="http://www.pluralsight.com/courses/jquery-tips-and-tricks" target="_blank">jQuery Tips and Tricks</a> [watch][$]</li>
<li><a href="http://www.pluralsight.com/courses/jquery-free-javascript" target="_blank">jQuery-free JavaScript</a> [watch][$]</li>
<li><a href="https://www.youtube.com/watch?v=Y2Y0U-2qJMs&list=PL5586336C26BDB324&index=2" target="_blank">Douglas Crockford: An Inconvenient API - The Theory of the DOM</a> [watch]</li>
</ul>
**参考/文档:**
<ul>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model" target="_blank">MDN Document Object Model</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/Events" target="_blank">MDN Event reference</a></li>
<li><a href="http://api.jquery.com/" target="_blank">jQuery Docs</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Window" target="_blank">MDN Browser Object Model</a></li>
<li><a href="https://msdn.microsoft.com/en-us/library/hh772384%28v=vs.85%29.aspx" target="_blank">msdn Document Object Model (DOM)</a></li>
</ul>
**标准和规范:**
<ul>
<li><a href="http://www.w3.org/TR/2014/WD-dom-20140204/" target="_blank">W3C DOM4</a></li>
<li><a href="https://dom.spec.whatwg.org/" target="_blank">DOM Living Standard</a></li>
<li><a href="http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105/" target="_blank">Document Object Model (DOM) Level 3 Events Specification</a></li>
<li><a href="http://www.w3.org/DOM/DOMTR" target="_blank">Document Object Model (DOM) Technical Reports</a></li>
</ul>