Home >Web Front-end >JS Tutorial >How to dynamically modify the content of web page elements with JavaScript_javascript skills
The example in this article describes how JavaScript can dynamically modify the content of web page elements. Share it with everyone for your reference. The specific analysis is as follows:
The following JS code dynamically specifies the content of the element through the element's textContent or innerHTML after the user clicks the submit button
<script type="text/javascript"> function showCard() { var message = document.getElementById("CCN").value; var element = document.getElementById("mycreditcardnumber"); element.textContent = message; //for Firefox element.innerHTML = message; //for IE (why can't we all just get along?) return true; } </script> <form name="dynamic" method="get"> <span>Enter Your Credit Card Number:</span> <input type="text" id="CCN" name="CCN" value="CCN" /> <input type="button" value="submit" onclick="showCard()" /> </form> <p>Verify your Credit Card Number: <span id="mycreditcardnumber">0000-00-0000-00 </span> </p>
I hope this article will be helpful to everyone’s JavaScript programming design.