📌 Daily Learning Log — JavaScript DOM Manipulation by Mr. Rohit Negi Today I learned how to select and update elements in the DOM and understood the difference between: 🔹 innerHTML → Reads/writes HTML (includes tags) 🔹 innerText → Reads visible text only (ignores hidden elements) 🔹 textContent → Reads all text (hidden + visible, no HTML formatting) 📍 Example from my console: const temp = document.getElementById("first"); temp.innerHTML // returns text + HTML tags temp.innerText // returns only visible text temp.textContent // returns all text even if hidden 🧠 Takeaway: DOM isn’t just about selecting elements — it’s about choosing the right property based on what we want to show or update in the browser. Leveling up step-by-step. 🚀 #Javascript #DOM #WebDevelopment #frontend #DailyLearning #CoderArmy #rohitnegi

Tech tip - setting the 'class' of an #svg element from #javascript I could not set the 'class' of an SVG element using the 'className' property in JavaScript. For example:   var bfyvSVG =        document.createElementNS('http://www.w3.org/2000/svg', 'svg');   bfyvSVG.id = 'bfyvSVG';   bfyvSVG.className = 'bfyvSvg-defs'; One answer is to use 'setAttribute':   bfyvSVG.setAttribute("class","bfyvSvg-defs"); I found the answer on 'stackoverflow.com':   https://lnkd.in/exgUCdtG For an SVG, 'className' means something a little different. I could have used 'className.baseVal'

Day 11 | JavaScript Fundamentals 🚀 🔹 Topic: DOM Manipulation 🔹 Post: How JavaScript Interacts with HTML Today’s learning focused on understanding the Document Object Model (DOM) and how JavaScript uses it to interact with HTML elements. DOM manipulation allows developers to dynamically update content, change styles, handle user events, and create interactive web experiences in real time. This concept is a core foundation for building responsive, dynamic, and user-friendly web applications. #JavaScript #DOMManipulation #WebDevelopmentJourney #FrontendDevelopment #JavaScriptBasics #LearnJavaScript #WebDeveloper #CodingLife #HTML #CSS #Programming #DeveloperCommunity #30DaysOfCode #DailyLearning #TechSkills #SoftwareDevelopment

An interactive front-end project built using HTML, CSS, and JavaScript that demonstrates the effective use of increment and decrement functions. This project focuses on real-time DOM manipulation, event handling, and strengthening core JavaScript concepts. 🔗 GitHub Repository: https://lnkd.in/dn-456Hw HINA NASEER AHMED Zeeshan Aijaz Wajid Ullah Saylani Mass IT Training #HTML #CSS #JavaScript #FrontendDevelopment #WebDevelopment #BeginnerProject #JavaScriptProjects #DOMManipulation #CodingJourney #LearningByDoing

✨ Just wrapped up building a simple JavaScript calculator from scratch! It takes two inputs and lets you choose your operation: ➕ Addition ➖ Subtraction ✖️ Multiplication ➗ Division This project helped me sharpen my DOM manipulation skills and reminded me how small fixes (like handling user choice correctly) can make a big difference. 💡 Key takeaway: Debugging isn’t just about fixing errors—it’s about learning how each piece interacts and grows your confidence as a developer. #coding #html #css #javascript #consistency #calculatordesign #frontend

🔶 InteractBtn Built InteractBtn , a JavaScript project demonstrating how user interactions are handled using DOM manipulation and event listeners.     🔧 Tech Stack: HTML | CSS | JavaScript  👉 Check it out : https://t.co/stwLT4iBd7    #JavaScript #WebDevelopment #Frontend #BuildInPublic #Learning

Seeing something many times and knowing its name or concept are two different things. Today, I learned the concept of higher-order functions. Had I used them before? Definitely. I use them in almost every analysis — I just didn't know they had a name. Higher-order functions are functions that take other functions as input or return functions as output. Once you learn the name, everything suddenly clicks. Sometimes learning isn't about something new — it's about putting a name on what you've already been doing. 📌 What is a Higher-Order Function? A higher-order function is a function that takes another function as an argument, returns a function, or both. It lets you pass behavior (logic) instead of hard-coding it. 🔹 Short examples JavaScript [1, 2, 3].map(x => x * 2); R sapply(c(1, 2, 3), function(x) x * 2) ➡️ map / sapply are higher-order functions because they receive a function that defines what to do with each element. #R #JavaScript #higherOrderFunctions #learningmustgoon 2:31 "He taught Adam the names of all things..."

🚀 JavaScript Mini Project – OTP Generator with Even/Odd Check Built a small JavaScript project that generates a random 4-digit OTP using Math.random() and displays it dynamically on the web page. 🔹 The OTP is checked using conditional logic 🔹 If the OTP is Even, the circle turns purple 🔹 If the OTP is Odd, the circle turns red 🔹 Used HTML, CSS, and JavaScript DOM manipulation This project helped me understand: Random number generation if–else conditions DOM access using getElementById Dynamic style changes with JavaScript Small steps, but building confidence every day 💪 Learning by doing is the best way forward. #JavaScript #HTML #CSS #DOM #WebDevelopment #LearningJourney #MiniProject #FrontendBasics

🚀 JavaScript DOM Practice – Background Color Changer 🎨 Built a simple and clean background color changer using HTML, CSS & JavaScript 💻✨ GitHub:https://lnkd.in/gZQFqQPU 🔹 Used getElementById() to access elements 🔹 Handled button click events with onclick 🔹 Dynamically changed background color and text content 🔹 Practiced DOM manipulation fundamentals 🎯 Buttons update the page instantly with different colors like 🔴 Red, 🟢 Green, 🟣 Purple, 🔵 Blue, 🟡 Yellow Small projects like this help strengthen JavaScript basics and build confidence step by step 💪📈 📌 10000 Coders 📌 #ValiBasha 📌 Spandana Chowdary #JavaScript #WebDevelopment #DOMManipulation #FrontendDevelopment #HTML #CSS #LearningByDoing #CodingJourney 🚀