Skip to content

Commit 277a895

Browse files
Josh-Cenabsmth
Josh-Cena
and
bsmth
authored
Modernize DOM guide (2): rename two pages, new Anatomy of the DOM page (#41569)
* Modernize DOM guide (2): rename two pages, new Anatomy of the DOM page * Apply suggestions from code review Co-authored-by: Brian Smith <[email protected]> * Update sidebar * Add diagram * Update index.md --------- Co-authored-by: Brian Smith <[email protected]>
1 parent ab7254f commit 277a895

File tree

20 files changed

+324
-64
lines changed

20 files changed

+324
-64
lines changed

‎files/en-us/_redirects.txt‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1363,7 +1363,7 @@
13631363
/en-US/docs/DOM/Input.setSelectionRange /en-US/docs/Web/API/HTMLInputElement/setSelectionRange
13641364
/en-US/docs/DOM/KeyboardEvent /en-US/docs/Web/API/KeyboardEvent
13651365
/en-US/docs/DOM/LinkStyle /en-US/docs/Web/API/HTMLLinkElement
1366-
/en-US/docs/DOM/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors
1366+
/en-US/docs/DOM/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree
13671367
/en-US/docs/DOM/Manipulating_the_browser_history /en-US/docs/Web/API/History_API
13681368
/en-US/docs/DOM/Manipulating_the_browser_history/Example /en-US/docs/Web/API/History_API/Working_with_the_History_API
13691369
/en-US/docs/DOM/MediaQueryList /en-US/docs/Web/API/MediaQueryList
@@ -2824,7 +2824,7 @@
28242824
/en-US/docs/Document_Object_Model_(DOM)/Input.select /en-US/docs/Web/API/HTMLInputElement/select
28252825
/en-US/docs/Document_Object_Model_(DOM)/Input.setSelectionRange /en-US/docs/Web/API/HTMLInputElement/setSelectionRange
28262826
/en-US/docs/Document_Object_Model_(DOM)/KeyboardEvent /en-US/docs/Web/API/KeyboardEvent
2827-
/en-US/docs/Document_Object_Model_(DOM)/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors
2827+
/en-US/docs/Document_Object_Model_(DOM)/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree
28282828
/en-US/docs/Document_Object_Model_(DOM)/MediaQueryList /en-US/docs/Web/API/MediaQueryList
28292829
/en-US/docs/Document_Object_Model_(DOM)/MediaQueryListListener /en-US/docs/Web/API/MediaQueryList
28302830
/en-US/docs/Document_Object_Model_(DOM)/NamedNodeMap /en-US/docs/Web/API/NamedNodeMap
@@ -7775,7 +7775,7 @@
77757775
/en-US/docs/Transforming_XML_with_XSLT:The_Netscape_XSLT_XPath_Reference:Elements:xsl:decimal-format /en-US/docs/Web/XML/XSLT/Reference/Element/decimal-format
77767776
/en-US/docs/Transforming_XML_with_XSLT:The_Netscape_XSLT_XPath_Reference:Elements:xsl:element /en-US/docs/Web/XML/XSLT/Reference/Element/element
77777777
/en-US/docs/Transforming_XML_with_XSLT:The_Netscape_XSLT_XPath_Reference:Functions /en-US/docs/Web/XML/XPath/Reference/Functions
7778-
/en-US/docs/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces /en-US/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
7778+
/en-US/docs/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces /en-US/docs/Web/API/Document_Object_Model/Building_and_updating_the_DOM_tree
77797779
/en-US/docs/URI /en-US/docs/Glossary/URI
77807780
/en-US/docs/URI/www and non-www URLs /en-US/docs/Web/URI/Guides/Choosing_between_www_and_non-www_URLs
77817781
/en-US/docs/URI/www_vs_non-www_URLs /en-US/docs/Web/URI/Guides/Choosing_between_www_and_non-www_URLs
@@ -8533,8 +8533,10 @@
85338533
/en-US/docs/Web/API/Document_Object_Model/Examples /en-US/docs/Web/API/Document_Object_Model
85348534
/en-US/docs/Web/API/Document_Object_Model/How_to_create_a_DOM_tree /en-US/docs/Web/API/Document_Object_Model
85358535
/en-US/docs/Web/API/Document_Object_Model/Introduction /en-US/docs/Web/API/Document_Object_Model
8536+
/en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree
85368537
/en-US/docs/Web/API/Document_Object_Model/Preface /en-US/docs/Web/API/Document_Object_Model
85378538
/en-US/docs/Web/API/Document_Object_Model/Transforming_with_XSLT /en-US/docs/Web/XML/XSLT/Guides/Transforming_XML_with_XSLT
8539+
/en-US/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces /en-US/docs/Web/API/Document_Object_Model/Building_and_updating_the_DOM_tree
85388540
/en-US/docs/Web/API/Document_Object_Model/Using_the_Document_Object_Model /en-US/docs/Web/API/Document_Object_Model
85398541
/en-US/docs/Web/API/Document_Object_Model/Using_the_Document_Object_Model/Example /en-US/docs/Web/API/Document_Object_Model
85408542
/en-US/docs/Web/API/Document_Object_Model/Using_the_W3C_DOM_Level_1_Core /en-US/docs/Web/API/Document_Object_Model
@@ -12843,7 +12845,7 @@
1284312845
/en-US/docs/Web/Guide/API/DOM/Events/Touch_events /en-US/docs/Web/API/Touch_events
1284412846
/en-US/docs/Web/Guide/API/DOM/Events/Touch_events_(Mozilla_experimental) /en-US/docs/Web/API/Touch_events
1284512847
/en-US/docs/Web/Guide/API/DOM/Events/Using_device_orientation_with_3D_transforms /en-US/docs/Web/API/Device_orientation_events/Using_device_orientation_with_3D_transforms
12846-
/en-US/docs/Web/Guide/API/DOM/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors
12848+
/en-US/docs/Web/Guide/API/DOM/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree
1284712849
/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history /en-US/docs/Web/API/History_API
1284812850
/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history/Example /en-US/docs/Web/API/History_API/Working_with_the_History_API
1284912851
/en-US/docs/Web/Guide/API/DOM/Storage /en-US/docs/Web/API/Web_Storage_API
@@ -12924,7 +12926,7 @@
1292412926
/en-US/docs/Web/Guide/DOM/Events/Touch_events /en-US/docs/Web/API/Touch_events
1292512927
/en-US/docs/Web/Guide/DOM/Events/Touch_events_(Mozilla_experimental) /en-US/docs/Web/API/Touch_events
1292612928
/en-US/docs/Web/Guide/DOM/Events/Using_device_orientation_with_3D_transforms /en-US/docs/Web/API/Device_orientation_events/Using_device_orientation_with_3D_transforms
12927-
/en-US/docs/Web/Guide/DOM/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors
12929+
/en-US/docs/Web/Guide/DOM/Locating_DOM_elements_using_selectors /en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree
1292812930
/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history /en-US/docs/Web/API/History_API
1292912931
/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history/Example /en-US/docs/Web/API/History_API/Working_with_the_History_API
1293012932
/en-US/docs/Web/Guide/DOM/Storage /en-US/docs/Web/API/Web_Storage_API

‎files/en-us/_wikihistory.json‎

Lines changed: 42 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -29464,6 +29464,47 @@
2946429464
"Dria"
2946529465
]
2946629466
},
29467+
"Web/API/Document_Object_Model/Building_and_updating_the_DOM_tree": {
29468+
"modified": "2020-08-22T02:28:27.619Z",
29469+
"contributors": [
29470+
"mfuji09",
29471+
"irenesmith",
29472+
"Zearin_Galaurum",
29473+
"ExE-Boss",
29474+
"dijonkitchen",
29475+
"epan5",
29476+
"jwhitlock",
29477+
"vinay97",
29478+
"teoli",
29479+
"marcio",
29480+
"rogerhc",
29481+
"kscarfone",
29482+
"Ichimonji10",
29483+
"jvns",
29484+
"trevorh",
29485+
"Sheppy",
29486+
"ethertank",
29487+
"TelaSocial",
29488+
"Nickolay",
29489+
"Jmtroncos",
29490+
"Huttarl",
29491+
"Koder",
29492+
"Mgjbot",
29493+
"Carrie zhxj",
29494+
"Waldo",
29495+
"Ranga.tech",
29496+
"Planche",
29497+
"Sebuls",
29498+
"Dria",
29499+
"Sandesh",
29500+
"NickolayBot",
29501+
"Burnt1ce85",
29502+
"Pslim",
29503+
"Jakul",
29504+
"Rvveelen",
29505+
"Ruby"
29506+
]
29507+
},
2946729508
"Web/API/Document_Object_Model/Events": {
2946829509
"modified": "2020-08-02T16:56:22.810Z",
2946929510
"contributors": [
@@ -29525,7 +29566,7 @@
2952529566
"Pomax"
2952629567
]
2952729568
},
29528-
"Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors": {
29569+
"Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree": {
2952929570
"modified": "2020-12-06T22:57:45.352Z",
2953029571
"contributors": [
2953129572
"jordan-git",
@@ -29543,47 +29584,6 @@
2954329584
"asadotzler"
2954429585
]
2954529586
},
29546-
"Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces": {
29547-
"modified": "2020-08-22T02:28:27.619Z",
29548-
"contributors": [
29549-
"mfuji09",
29550-
"irenesmith",
29551-
"Zearin_Galaurum",
29552-
"ExE-Boss",
29553-
"dijonkitchen",
29554-
"epan5",
29555-
"jwhitlock",
29556-
"vinay97",
29557-
"teoli",
29558-
"marcio",
29559-
"rogerhc",
29560-
"kscarfone",
29561-
"Ichimonji10",
29562-
"jvns",
29563-
"trevorh",
29564-
"Sheppy",
29565-
"ethertank",
29566-
"TelaSocial",
29567-
"Nickolay",
29568-
"Jmtroncos",
29569-
"Huttarl",
29570-
"Koder",
29571-
"Mgjbot",
29572-
"Carrie zhxj",
29573-
"Waldo",
29574-
"Ranga.tech",
29575-
"Planche",
29576-
"Sebuls",
29577-
"Dria",
29578-
"Sandesh",
29579-
"NickolayBot",
29580-
"Burnt1ce85",
29581-
"Pslim",
29582-
"Jakul",
29583-
"Rvveelen",
29584-
"Ruby"
29585-
]
29586-
},
2958729587
"Web/API/DragEvent": {
2958829588
"modified": "2020-10-15T21:29:10.598Z",
2958929589
"contributors": [

‎files/en-us/mozilla/firefox/releases/3.5/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ sidebar: firefox
6060
- : Firefox 3.5 supports web workers to allow easy multi-threading support in web applications.
6161
- [Using geolocation](/en-US/docs/Web/API/Geolocation_API)
6262
- : Firefox 3.5 supports the Geolocation API, which allows web applications to obtain information about the user's current location if a provider for that information is installed and enabled.
63-
- [Locating DOM elements using selectors](/en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors)
63+
- [Locating DOM elements using selectors](/en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree)
6464
- : The selectors API allows querying a document to locate the elements that match a given selection rule.
6565
- [Mouse gesture events](https://web.archive.org/web/20210724051233/https://developer.mozilla.org/en-US/docs/Web/Events/Mouse_gesture_events)
6666
- : Firefox 3.5 supports mouse gesture events such as trackpad swipes.

‎files/en-us/web/accessibility/guides/seizure_disorders/index.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -363,9 +363,9 @@ The contrast ratio is defined in [WCAG 2.2](https://w3c.github.io/wcag/guideline
363363

364364
It's best if you can adjust the contrast before it is uploaded or published to the web. For videos and animated GIFs, the Adobe Suite of products is a phenomenal resource for traditional images. Also for images, an online tool available is pinetools.com's [Brightness and contrast online](https://pinetools.com/brightness-contrast-image). If you intend to make animated GIFs, for example, start with one that has a lower contrast ratio.
365365

366-
JavaScript is also an option for reducing contrast dynamically. Here's a code example from the section titled, ["Example: Setting the background color of a paragraph"](/en-US/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces#setting_the_background_color_of_a_paragraph) from the MDN document, [Traversing an HTML table with JavaScript and DOM Interfaces](/en-US/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces). Notice that the color in the example is described in the **RGB** color space.
366+
JavaScript is also an option for reducing contrast dynamically. Here's a code example from the section titled, ["Example: Setting the background color of a paragraph"](/en-US/docs/Web/API/Document_Object_Model/Building_and_updating_the_DOM_tree#setting_the_background_color_of_a_paragraph). Notice that the color in the example is described in the **RGB** color space.
367367

368-
**HTML Content [(link to source page)](/en-US/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces#html_2)**
368+
**HTML Content [(link to source page)](/en-US/docs/Web/API/Document_Object_Model/Building_and_updating_the_DOM_tree#html_2)**
369369

370370
```html
371371
<body>
@@ -375,7 +375,7 @@ JavaScript is also an option for reducing contrast dynamically. Here's a code ex
375375
</body>
376376
```
377377

378-
**JavaScript Content [(link to source page)](/en-US/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces#javascript_2)**
378+
**JavaScript Content [(link to source page)](/en-US/docs/Web/API/Document_Object_Model/Building_and_updating_the_DOM_tree#javascript_2)**
379379

380380
```js
381381
function setBackground() {

‎files/en-us/web/api/document/queryselector/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -170,7 +170,7 @@ Clicking the first button gives an error, while the second and third buttons wor
170170

171171
## See also
172172

173-
- [Locating DOM elements using selectors](/en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors)
173+
- [Selection and traversal on the DOM tree](/en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree)
174174
- {{domxref("Element.querySelector()")}}
175175
- {{domxref("Document.querySelectorAll()")}}
176176
- {{domxref("Element.querySelectorAll()")}}

‎files/en-us/web/api/document/queryselectorall/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -189,7 +189,7 @@ Clicking the first button gives an error, while the second and third buttons wor
189189

190190
## See also
191191

192-
- [Locating DOM elements using selectors](/en-US/docs/Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors)
192+
- [Selection and traversal on the DOM tree](/en-US/docs/Web/API/Document_Object_Model/Selection_and_traversal_on_the_DOM_tree)
193193
- [Attribute selectors](/en-US/docs/Web/CSS/Attribute_selectors) in the CSS
194194
Guide
195195
- [Attribute selectors](/en-US/docs/Learn_web_development/Core/Styling_basics/Attribute_selectors) in the MDN Learning Area

0 commit comments

Comments
 (0)