Tasks completed

01/app.js

@@ -1 +1,9 @@
-console.log('DOM');
+console.log('DOM');
+
+const commentsItem = document.querySelector(
+	'.comments__item.comments__item--newest'
+);
+
+const dataInfo = commentsItem.querySelectorAll('[data-info]');
+
+console.log(dataInfo.length);

02/app.js

@@ -1 +1,8 @@
-console.log('DOM');
+console.log('DOM');
+
+const links = document.querySelectorAll('a[data-url]');
+
+links.forEach((element) => {
+	const dataUrl = element.getAttribute('data-url');
+	element.setAttribute('href', dataUrl);
+});

03/app.js

@@ -1,14 +1,30 @@
 console.log('DOM');
 
 const buttonSettings = {
-    attr: {
-        className: 'btn',
-        title: 'super button'
-    },
-    css: {
-        border: '1px solid #336699',
-        padding: '5px 20px',
-        color: '#444'
-    },
-    text: 'Click me!',
-}
+	attr: {
+		className: 'btn',
+		title: 'super button',
+	},
+	css: {
+		border: '1px solid #336699',
+		padding: '5px 20px',
+		color: '#444',
+	},
+	text: 'Click me!',
+};
+
+const button = document.createElement('button');
+const buttonParent = document.querySelector('.parent-for-button');
+
+for (const prop in buttonSettings.attr) {
+	button.setAttribute(prop, buttonSettings.attr[prop]);
+}
+
+for (const prop in buttonSettings.css) {
+	console.log(buttonSettings.css[prop]);
+	button.style[prop] = buttonSettings.css[prop];
+}
+
+button.innerText = buttonSettings.text;
+
+buttonParent.appendChild(button);

04/app.js

@@ -2,7 +2,27 @@ console.log('DOM');
 
 // struktura do wykorzystania w pętli
 const menuItems = [
-    {text: 'start', url: '/'},
-    {text: 'galeria', url: '/gallery'},
-    {text: 'kontakt', url: '/contact'},
-];
+	{ text: 'start', url: '/' },
+	{ text: 'galeria', url: '/gallery' },
+	{ text: 'kontakt', url: '/contact' },
+];
+
+const menu = document.createElement('ul');
+
+//bez foreach
+menu.innerHTML = `
+    <li><a href="/">start</a></li>
+    <li><a href="/gallery">galeria</a></li>
+    <li><a href="/contact">kontakt</a></li>`;
+
+//z foreach
+menuItems.forEach((el) => {
+	const li = document.createElement('li');
+	const a = document.createElement('a');
+	a.innerText = el.text;
+	a.setAttribute('href', el.url);
+	li.appendChild(a);
+	menu.appendChild(li);
+});
+
+document.querySelector('nav').appendChild(menu);

05/app.js

@@ -1,3 +1,33 @@
 console.log('DOM');
 
 const curr = document.querySelector('.js-curr');
+
+// 1
+const btn = document.createElement('button');
+btn.innerText = 'Usuń z koszyka';
+curr.after(btn);
+
+// 2
+const siblings = curr.parentElement.children;
+const siblingsArr = Array.from(siblings);
+
+siblingsArr.forEach((element) => {
+	element !== curr ? element.classList.add('siblings') : '';
+});
+
+// 3
+const nextArticle = curr.parentElement.nextElementSibling.setAttribute(
+	'title',
+	'nextElementSibling'
+);
+
+// 4
+const p = document.createElement('p');
+p.innerText = 'THIS IS A NEW PARAGRAPH';
+const lastArticle = curr.parentElement.parentElement.lastElementChild;
+lastArticle.insertBefore(p, lastArticle.lastElementChild);
+
+// 5
+const section = curr.parentElement.parentElement;
+const clone = curr.parentElement.nextElementSibling.cloneNode(true);
+section.prepend(clone);