Skip to content

Commit bb97418

Browse files
committed
fixes #1469
1 parent 95f61ee commit bb97418

File tree

2 files changed

+11
-4
lines changed

2 files changed

+11
-4
lines changed

2-ui/1-document/02-dom-nodes/article.md

+7-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,13 @@ document.body.style.background = 'red'; // make the background red
2222
setTimeout(() => document.body.style.background = '', 3000); // return back
2323
```
2424

25-
That was just a glimpse of the DOM's power. Soon we'll learn more ways to manipulate the DOM, but first we need to know about its structure.
25+
Here we used `style.background` to change the background color of `document.body`, but there are many other properties, such as:
26+
27+
- `innerHTML` -- HTML contents of the node.
28+
- `offsetWidth` -- the node width (in pixels)
29+
- ...and so on.
30+
31+
Soon we'll learn more ways to manipulate the DOM, but first we need to know about its structure.
2632

2733
## An example of the DOM
2834

2-ui/1-document/03-dom-navigation/article.md

+4-3
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,7 @@ There are two important consequences:
149149
The first thing is nice. The second is tolerable, because we can use `Array.from` to create a "real" array from the collection, if we want array methods:
150150
151151
```js run
152-
alert( Array.from(document.body.childNodes).filter ); // now it's there
152+
alert( Array.from(document.body.childNodes).filter ); // function
153153
```
154154
155155
```warn header="DOM collections are read-only"
@@ -311,8 +311,9 @@ An example of usage:
311311
</table>
312312
313313
<script>
314-
// get the content of the first row, second cell
315-
alert( table.*!*rows[0].cells[1]*/!*.innerHTML ) // "two"
314+
// get td with "two" (first row, second column)
315+
let td = table.*!*rows[0].cells[1]*/!*;
316+
td.style.backgroundColor = "red"; // highlight it
316317
</script>
317318
```
318319

0 commit comments

Comments
 (0)