Search code examples
javascripthtmlmarquee

Marquee nodeValue update dynamically

I have a basic problem where I couldn't update the marquee nodeValue dynamically. The following is the HTML Code.

<!DOCTYPE html>
<html>
    <head>
       <script src="update.js" language="javascript" type="text/javascript"></script>
    </head>
    <body>
       <marquee behavior="scroll" direction="left" id="marquee"></marquee>
    </body>
</html>

And the update.js is

document.getElementById("marquee").firstChild.nodeValue = "New Text";
document.getElementById("marquee").start();

Can anyone tell me how to update the Marquee from other javascript.

Solution

  • Your marquee element does not have a firstChild. Your code will work as it is if you give it a default value:

    <marquee behavior="scroll" direction="left" id="marquee">Default</marquee>

    Alternatively, you can set its textContent (or innerText where appropriate):

    document.getElementById("marquee").textContent = "New Text";

    But marquee... really?! I'd suggest looking at alternative solutions.