blob: 9475de14d58f22b94c265bf765a975585d6142fe (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
|
---
title: Document Object Model (DOM)
slug: DOM
tags:
- DOM
- NeedsTranslation
- References
- TopicStub
translation_of: Web/API/Document_Object_Model
---
<div class="geckoVersionNote">
<div class="callout-box">
<strong><a href="/en-US/docs/Using_the_W3C_DOM_Level_1_Core" title="en-US/docs/Using_the_W3C_DOM_Level_1_Core">Using the W3C DOM Level 1 Core</a></strong><br>
Introduction to the W3C DOM.</div>
</div>
<div>
<p><span class="seoSummary">The <strong>Document Object Model</strong> (<strong>DOM</strong>) is an API for <a href="/en-US/docs/HTML" title="en-US/docs/HTML">HTML</a> and <a href="/en-US/docs/XML" title="en-US/docs/XML">XML</a> documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as <a href="/en-US/docs/JavaScript" title="https://developer.mozilla.org/en-US/docs/JavaScript">JavaScript</a>.</span></p>
</div>
<div class="cleared topicpage-table row">
<div class="section">
<h2 class="Documentation" id="Documentation" name="Documentation">Documentation about the DOM</h2>
<dl>
<dt>
<a href="/en-US/docs/Gecko_DOM_Reference" title="en-US/docs/Gecko_DOM_Reference">Gecko DOM Reference</a></dt>
<dd>
The Gecko Document Object Model Reference.</dd>
<dt>
<a href="/en-US/docs/DOM/About_the_Document_Object_Model" title="en-US/docs/About_the_Document_Object_Model">About the Document Object Model</a></dt>
<dd>
A short introduction to the DOM.</dd>
<dt>
<a href="/en-US/docs/JavaScript_technologies_overview" title="en-US/docs/The_DOM_and_JavaScript">The DOM and JavaScript</a></dt>
<dd>
What is the DOM? What is JavaScript? How do I use them together on my web page? This document answers these questions and more.</dd>
<dt>
<a href="/en-US/docs/DOM/Using_dynamic_styling_information" title="en-US/docs/DOM/Using_dynamic_styling_information">Using dynamic styling information</a></dt>
<dd>
How to obtain information on and manipulate styling via the DOM.</dd>
<dt>
<a href="/en-US/docs/DOM/DOM_event_reference" title="DOM event reference">DOM event reference</a></dt>
<dd>
Lists all the DOM events and their meanings.</dd>
<dt>
<a href="/en-US/docs/DOM/Manipulating_the_browser_history" title="en-US/docs/DOM/Manipulating_the_browser_history">History API: Manipulating the browser history</a></dt>
<dd>
Demonstrates the HTML5-introduced DOM {{ domxref("window.history") }} object, allowing dynamic changes to the browser history.</dd>
<dt>
<a href="/en-US/docs/Using_files_from_web_applications" title="https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications">File API: Using files from web applications</a></dt>
<dd>
Describes the HTML5-introduced capability to select a local file and read data from it.</dd>
<dt>
<a href="/en-US/docs/DOM/Using_the_Page_Visibility_API" title="en-US/docs/DOM/Using_the_Page_Visibility_API">Using the Page Visibility API</a></dt>
<dd>
Explains how to detect and use information about a web page being in the foreground or in the background.</dd>
<dt>
<a href="/en-US/docs/DOM/Using_full-screen_mode" title="Using full-screen mode">Fullscreen API: Using the fullscreen mode</a></dt>
<dd>
Describes how to set up a page that use the whole screen, without any browser UI around it.</dd>
<dt>
<a href="/en-US/docs/Determining_the_dimensions_of_elements" title="en-US/docs/Determining_the_dimensions_of_elements">Determining the dimensions of elements</a></dt>
<dd>
How to figure out the right way to determine the dimensions of elements, given your needs.</dd>
<dt>
<a href="/en-US/docs/Dynamically_modifying_XUL-based_user_interface" title="en-US/docs/Dynamically_modifying_XUL-based_user_interface">Dynamically modifying XUL-based user interface</a></dt>
<dd>
The basics of manipulating the XUL UI with DOM methods.</dd>
</dl>
<p><span class="alllinks"><a href="/en-US/docs/tag/DOM" title="/en-US/docs/tag/DOM">View All...</a></span></p>
</div>
<div class="section">
<h2 class="Community" id="Community" name="Community">Getting help from the community</h2>
<p>You need help on a DOM-related problem and can't find the solution in the documentation?</p>
<ul>
<li>Consult the dedicated Mozilla forum: {{ DiscussionList("dev-tech-dom", "mozilla.dev.tech.dom") }}</li>
</ul>
<h2 class="Tools" id="Tools" name="Tools">Tools easing working with the DOM</h2>
<ul>
<li><a class="external" href="http://www.getfirebug.com/">Firebug </a></li>
<li><a href="/en-US/docs/DOM_Inspector" title="en-US/docs/DOM_Inspector">DOM Inspector</a></li>
<li><a class="external" href="http://slayeroffice.com/tools/modi/v2.0/modi_help.html">Mouse-over DOM Inspector</a></li>
<li><a class="external" href="http://www.karmatics.com/aardvark/">Aardvark Firefox extension</a></li>
</ul>
<p><span class="alllinks"><a href="/en-US/docs/tag/DOM:Tools" title="/en-US/docs/tag/DOM:Tools">View All...</a></span></p>
<h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Related Topics</h2>
<ul>
<li><a href="/en-US/docs/AJAX" title="en-US/docs/AJAX">AJAX</a>, <a href="/en-US/docs/CSS" title="en-US/docs/CSS">CSS</a>, <a href="/en-US/docs/DHTML" title="en-US/docs/DHTML">DHTML</a>, <a href="/en-US/docs/JavaScript" title="en-US/docs/JavaScript">JavaScript</a></li>
</ul>
</div>
</div>
<p> </p>
|