From 1d9c8df17b90f8dfbf6cbfe49cfd0acbb78c9a14 Mon Sep 17 00:00:00 2001
From: Alexander Popov <iiiypuk@fastmail.fm>
Date: Sun, 12 Mar 2023 00:11:13 +0300
Subject: [PATCH] array from html children

---
 .../2023/javascript/foreach-html-children.md  | 35 +++++++++++++++++++
 1 file changed, 35 insertions(+)
 create mode 100644 content/posts/2023/javascript/foreach-html-children.md

diff --git a/content/posts/2023/javascript/foreach-html-children.md b/content/posts/2023/javascript/foreach-html-children.md
new file mode 100644
index 0000000..49638cc
--- /dev/null
+++ b/content/posts/2023/javascript/foreach-html-children.md
@@ -0,0 +1,35 @@
+---
+title: "👶🏻 Перебор потомков HTML элемента"
+date: 2023-03-12T00:10:00+03:00
+draft: false
+tags: [tips, javascript]
+---
+
+## Перебор потомков HTML элемента
+
+Просто так применить метод `forEach` к атрибуту `.children`
+HTML элемента не получится.  
+Для начала необходимо преобразовать атрибут в массив.
+
+Предположим, что `pageContent` — это `div` с некоторыми однотипными элементами,
+которые нужно перебрать методом `forEach`.
+
+```javascript
+let pageContent = document.getElementById('page-content');
+```
+
+Вот несколько примеров, как преобразовать атрибут
+`pageContent.children` в массив.
+
+```javascript
+let pageContentChildren = [...pageContent.children];
+// или
+let pageContentChildren = [].slice.call(pageContent.children);
+```
+
+В **ECMAScript 6** добавлено новое API, а именно метод `.from`
+для создания массивов из итерируемых объектов.
+
+```javascript
+let pageContentChildren = Array.from(pageContent.children.children);
+```