diff --git a/2-ui/1-document/04-searching-elements-dom/article.md b/2-ui/1-document/04-searching-elements-dom/article.md index 133951bd3..eb111bc00 100644 --- a/2-ui/1-document/04-searching-elements-dom/article.md +++ b/2-ui/1-document/04-searching-elements-dom/article.md @@ -2,11 +2,11 @@ Властивості навігації по DOM чудові, коли елементи розташовані близько один до одного. А якщо ні? Як отримати довільний елемент сторінки? -Для цього існують додаткові методи пошуку. +Для цього в DOM існують додаткові методи пошуку. ## document.getElementById або просто id -Якщо елемент має атрибут `id`, ми можемо отримати його за допомогою методу `document.getElementById(id)`, незалежно від того, де він знаходиться. +Якщо елемент має атрибут `id`, ми можемо отримати його викликом `document.getElementById(id)`, незалежно від того, де він знаходиться. Наприклад: @@ -42,7 +42,7 @@ ``` -...Але це лише якщо ми не оголошуємо змінну JavaScript з тим самим ім’ям, інакше вона матиме пріоритет: +...Але це лише якщо ми не оголосили змінну JavaScript з таким же ім’ям, інакше вона матиме пріоритет: ```html run untrusted height=0
@@ -57,28 +57,28 @@ ```warn header="Будь ласка, не використовуйте id-іменовані глобальні змінні для доступу до елементів" Ця поведінка описана [у специфікації](http://www.whatwg.org/specs/web-apps/current-work/#dom-window-nameditem), тож це свого роду стандарт. Але він підтримується в основному для сумісності. -Браузер намагається нам допомогти, змішуючи простори імен JS і DOM. Це добре для простих сценаріїв, вбудованих у HTML, але загалом це не дуже добре. Можуть виникнути конфлікти імен. Крім того, коли хтось читає JS-код і не бачить HTML, незрозуміло, звідки приходить змінна. +Браузер намагається нам допомогти, змішуючи простори імен JS і DOM. Це зручно для простих скриптів, які знаходяться прямо в HTML, але загалом це не дуже добре. Можуть виникнути конфлікти імен. Крім того, коли хтось читає JS-код і не бачить HTML, незрозуміло, звідки приходить змінна. -Тут у підручнику ми використовуємо `id` для прямого посилання на елемент для стислості, коли очевидно, звідки цей елемент походить. +У цьому посібнику ми будемо використовувати `id` для прямого посилання на елемент для стислості, коли очевидно, звідки цей елемент походить. -У реальному житті краще надавати перевагу `document.getElementById`. +У реальному житті краще використовувати `document.getElementById`. ``` -```smart header="`id` має бути унікальним" -`id` має бути унікальним. У документі може бути лише один елемент із заданим `id`. +```smart header="Значення `id` має бути унікальним" +Значення `id` має бути унікальним. У документі повинен бути лише один елемент із заданим `id`. -Якщо є кілька елементів з однаковим `id`, то поведінка методів, які його використовують, буде непередбачуваною, наприклад. `document.getElementById` може повертати будь-який з таких елементів випадковим чином. Тому, будь ласка, дотримуйтеся правила та залишайте `id` унікальним. +Якщо є кілька елементів з однаковим `id`, то поведінка методів, які його використовують є непередбачуваною. Наприклад, `document.getElementById` може повертати будь-який з таких елементів випадковим чином. Тому, будь ласка, дотримуйтеся правила та залишайте `id` унікальним. ``` ```warn header="Лише `document.getElementById`, а не `anyElem.getElementById`" -Метод `getElementById` можна викликати лише для об’єкта `document`. Він шукає вказаний `id` у всьому документі. +Метод `getElementById` може бути викликаний лише на об’єкті `document`. Він шукає вказаний `id` у всьому документі. ``` ## querySelectorAll [#querySelectorAll] -До сьогодні найуніверсальніший метод -- це `elem.querySelectorAll(css)`, він повертає всі елементи всередині `elem`, що відповідають заданому CSS-селектору. +Найбільш гнучким методом є `elem.querySelectorAll(css)`, який повертає всі елементи всередині `elem`, що відповідають заданому CSS-селектору. -Тут ми шукаємо всі елементи `
  • `, які є останніми дочірніми: +Тут ми шукаємо всі елементи `
  • `, які є останніми дочірніми елементами: ```html run