es10 and output ques updated

Author: lgope

DOM-Manipulation-And-Events/Access-From-DOM/index.html

@@ -40,6 +40,15 @@ <h3>Article 003</h3>
                         asperiores odio est? Doloribus atque laborum pariatur fugit alias sunt possimus neque beatae,
                         unde dolorum nisi non minima!</p>
                 </article>
+
+                <article id="art-004" class="m-2 p-2 border border-secondary">
+                    <h3>Article 004</h3>
+                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Neque pariatur molestias minus. Quia
+                        ullam voluptas laboriosam reprehenderit quisquam dolores dignissimos magni fuga dolor, animi
+                        voluptatem temporibus maiores totam facere eum odit sint, consequatur eveniet inventore cum
+                        officiis. At, sint voluptates exercitationem, quidem obcaecati id molestias cum dignissimos
+                        velit possimus nisi.</p>
+                </article>
             </main>
             <aside id="sidebar" class="col-sm-4 bg-info text-white">
                 <h4>Sidebar</h4>
@@ -60,4 +69,4 @@ <h4>Sidebar</h4>
         crossorigin="anonymous"></script>
 </body>
 
-</html>
+</html>

DOM-Manipulation-And-Events/Access-From-DOM/scripts.js

@@ -1,48 +1,48 @@
 // Get access to the DOM
-const main = document.querySelector('main');
+const main = document.querySelector("main");
 
-const articles = document.getElementsByTagName('article');
-const paragraphs = document.getElementsByTagName('p');
+const articles = document.getElementsByTagName("article");
+const paragraphs = document.getElementsByTagName("p");
 
 const firstArticle = articles[0];
 const secondParagraphs = paragraphs[1];
 
-const whiteTextElements = document.getElementsByClassName('text-white');
+const whiteTextElements = document.getElementsByClassName("text-white");
 
-const sidebar = document.getElementById('sidebar');
+const sidebar = document.getElementById("sidebar");
 
 // Modify the DOM
-const mainHeading = document.getElementById('main-heading');
-mainHeading.textContent = 'Modify the DOM';
+const mainHeading = document.getElementById("main-heading");
+mainHeading.textContent = "Modify the DOM";
 
 // Getting access to the parent tag
-const header = document.getElementById('page-header');
-header.innerHTML = '<h2>Modify the DOM</h2>';
+const header = document.getElementById("page-header");
+header.innerHTML = "<h2>Modify the DOM</h2>";
 
 // A touch of class with classList
-header.classList.add('text-center');
+header.classList.add("text-center");
 
-sidebar.classList.remove('bg-info');
-sidebar.classList.add('bg-success');
+sidebar.classList.remove("bg-info");
+sidebar.classList.add("bg-success");
 
 // Working with style
-header.style.padding = '1em';
-header.classList.remove('bg-dark');
-header.style.backgroundColor = '#B54135';
+header.style.padding = "1em";
+header.classList.remove("bg-dark");
+header.style.backgroundColor = "#26e5d6";
 
 // The joy of creation (adding new article)
-let newArticle = document.createElement('article');
-let newHeading = document.createElement('h3');
-let newParagraph = document.createElement('p');
+let newArticle = document.createElement("article");
+let newHeading = document.createElement("h3");
+let newParagraph = document.createElement("p");
 
-newHeading.textContent = 'Article 004';
-newParagraph.textContent = 'Lorem ipsum dolor, sit amet consectetur adipisicing elit. Neque consequatur impedit, et nulla fuga iste tempora doloribus dolores, aliquid quod nihil dicta! Modi, quaerat officiis! Quia repudiandae accusamus ad impedit corrupti pariatur, quod nam, velit eum, quas voluptatem! Repellat est quidem beatae eum sint?';
+newHeading.textContent = "Article 005";
+newParagraph.textContent ="Lorem ipsum, dolor sit amet consectetur adipisicing elit. Cum aliquam officiis deserunt excepturi molestias culpa maxime hic? Iure autem quidem velit unde quo hic sed veritatis eaque. Neque, perspiciatis ullam, eum consequatur necessitatibus totam nam aliquid eaque officiis illo ducimus ab libero quas laborum quod. Nemo veritatis perferendis, necessitatibus fugiat repellendus nam aut expedita esse aspernatur, suscipit officiis magni praesentium.";
 
 newArticle.appendChild(newHeading);
 newArticle.appendChild(newParagraph);
 
-newArticle.classList.add('m-2', 'p-2', 'border', 'border-secondary');
+newArticle.classList.add("m-2", "p-2", "border", "border-secondary");
 
-newArticle.setAttribute('id', 'art-004');
+newArticle.setAttribute("id", "art-005");
 
-main.appendChild(newArticle);
+main.appendChild(newArticle);

DOM-Manipulation-And-Events/Access-From-DOM/shawon.jpg

@@ -20,3 +20,16 @@ function asyncForEach(array, cb) {
 asyncForEach([1, 2, 3, 4], (i) => {
   console.log(i);
 })
+
+
+// 4) Output? And explain (hint: Octal)
+console.log(016)
+
+console.log(017)
+
+console.log(026)
+
+console.log(027)
+
+// 5) Output?
+console.log([...'Hello']);