printing variable in js html

Question

<script type ="text/javascript">
    var current = 0;
</script>
                    

<h3 style={{marginTop: '10', textAlign: 'center'}}><b>Current Affect: <script type="text/javascript">document.write(current)</script></b></h3>

only outcome is "Current Affect:" can't print 0

Answer 1

Your code does, in fact, produce the 0 that you should get although your approach uses techniques that are about 20+ years old and not how modern code is written.

document.write() is not recommended unless you are dynamically creating a new document in a new window.

Also, inline scripts are not an appropriate way to inject dynamic content into the page. Instead, create an HTML element that will act as a placeholder for the results and use the DOM API to populate the element.

Lastly, type="text/javascript" on script tags hasn't been needed in over 5 years.

<h3 style={{marginTop: '10', textAlign: 'center'}}>Current Affect: <span id="result"></span></h3>

<script>
  var current = 0;
  // Access the HTML placeholder and populate it with the dynamic content
  document.getElementById("result").textContent = current;
</script>