Show Output
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>JavaScript Get Only Element Child Nodes</title> </head> <body> <div id="main"> <h1 id="title">My Heading</h1> <p id="hint"><span>This is some text.</span></p> </div> <script> let main = document.getElementById("main"); console.log(main.firstElementChild.nodeName); // Prints: H1 main.firstElementChild.style.color = "red"; let hint = document.getElementById("hint"); console.log(hint.firstElementChild.nodeName); // Prints: SPAN hint.firstElementChild.style.color = "blue"; </script> <p><strong>Note:</strong> Please check out the browser console by pressing the f12 key on the keyboard.</p> </body> </html>
