Skip to content

Commit fc36121

Browse files
authored
Apply suggestions from code review
1 parent 867e9a3 commit fc36121

File tree

1 file changed

+9
-9
lines changed

1 file changed

+9
-9
lines changed

2-ui/1-document/07-modifying-document/article.md

+9-9
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
# Внесення змін в документ
22

3-
Модифікації DOM є ключем до створення «живих» сторінок.
3+
Модифікації DOM є ключем до створення "живих" сторінок.
44

5-
Тут ми побачимо, як створювати нові елементи «на льоту» та змінювати ті, що вже існують.
5+
Тут ми побачимо, як створювати нові елементи "на льоту" та змінювати ті, що вже існують.
66

77
## Приклад: показати повідомлення
88

@@ -192,7 +192,7 @@ after
192192
- `"beforeend"` -- вставити `html` в `elem`, в кінці,
193193
- `"afterend"` -- вставити `html` безпосередньо після `elem`.
194194

195-
Другим параметром є рядок HTML, який вставляється «як HTML».
195+
Другим параметром є рядок HTML, який вставляється "як HTML".
196196

197197
Наприклад:
198198

@@ -225,7 +225,7 @@ after
225225
- `elem.insertAdjacentText(куди, текст)` -- синтаксис той самий, але рядок тексту вставляється «як текст» замість HTML
226226
- `elem.insertAdjacentElement(куди, текст)` -- синтаксис той самий, але вставляється елемент
227227

228-
Наведені методи існують для того, щоб синтаксис залишався «однорідним». На практиці найчастіше використовується `insertAdjacentHTML`. Тому що для вставки елементів та тексту є методи `append/prepend/before/after` -- вони коротші для написання і так само вміють вставляти вузли чи фрагменти тексту.
228+
Наведені методи існують для того, щоб синтаксис залишався "однорідним". На практиці найчастіше використовується `insertAdjacentHTML`. Тому що для вставки елементів та тексту є методи `append/prepend/before/after` -- вони коротші для написання і так само вміють вставляти вузли чи фрагменти тексту.
229229

230230
Отже, ось альтернативний варіант показу повідомлення:
231231

@@ -358,7 +358,7 @@ ul.append(getListContent()); // (*)
358358
</script>
359359
```
360360

361-
Зверніть увагу, що в останньому рядку коду `(*)` ми додаємо `DocumentFragment`, але він «зникає», тому в результаті структура буде такою:
361+
Зверніть увагу, що в останньому рядку коду `(*)` ми додаємо `DocumentFragment`, але він "зникає", тому в результаті структура буде такою:
362362

363363
```html
364364
<ul>
@@ -368,7 +368,7 @@ ul.append(getListContent()); // (*)
368368
</ul>
369369
```
370370

371-
`DocumentFragment` рідко використовується явно. Навіщо додавати до вузла особливого типу, якщо натомість можна повернути масив вузлів? Переписаний приклад:
371+
`DocumentFragment` рідко використовується явно. Навіщо додавати до вузла особливого типу, якщо натомість можна повернути масив вузлів? Переписаний приклад:
372372

373373
```html run
374374
<ul id="ul"></ul>
@@ -489,7 +489,7 @@ ul.append(...getListContent()); // append + оператор "..." = друзі!
489489
<p>Кінець</p>
490490
```
491491

492-
Виклик `document.write(html)` записує `html` на сторінку «прямо тут і зараз». Рядок `html` може бути згенерований динамічно, тож метод дещо гнучкий. За допомогою JavaScript ми можемо створити повноцінну вебсторінку та записати її в документ.
492+
Виклик `document.write(html)` записує `html` на сторінку "прямо тут і зараз". Рядок `html` може бути згенерований динамічно, тож метод досить гнучкий. За допомогою JavaScript ми можемо створити повноцінну вебсторінку та записати її вміст в документ.
493493

494494
Метод прийшов з тих часів коли не було ні DOM, ні стандартів... Справді давні часи. Метод досі живий, тому що є скрипти, в яких він використовується.
495495

@@ -516,7 +516,7 @@ ul.append(...getListContent()); // append + оператор "..." = друзі!
516516

517517
Це його недолік.
518518

519-
Окрім того, є і перевага. Технічно, коли `document.write` викликається поки браузер читає («розбирає») вхідний HTML і щось записує в документ, то браузер сприймає його так, наче він з самого початку був там, в HTML-документі.
519+
Окрім того, є і перевага. Технічно, коли `document.write` викликається поки браузер читає ("розбирає") вхідний HTML і щось записує в документ, то браузер сприймає його так, наче він з самого початку був там, в HTML-документі.
520520

521521
Тому він працює надзвичайно швидко, адже не відбувається *жодних DOM-модифікацій*. Він записує безпосередньо в текст сторінки, поки DOM ще не сформований.
522522

@@ -531,7 +531,7 @@ ul.append(...getListContent()); // append + оператор "..." = друзі!
531531

532532
- Вставка та видалення:
533533
- `node.append(...nodes or strings)` -- вставляє в `node`, в кінець,
534-
- `node.prepend(...nodes or strings)` -- вставляє в `node`, на початок,
534+
- `node.prepend(...nodes or strings)` -- вставляє в `node`, на початку,
535535
- `node.before(...nodes or strings)` -- вставляє прямо перед `node`,
536536
- `node.after(...nodes or strings)` -- вставляє відразу після `node`,
537537
- `node.replaceWith(...nodes or strings)` -- замінює `node`.

0 commit comments

Comments
 (0)