Javascript Element How to - Insert text into a div element faster

Question

We would like to know how to insert text into a div element faster.

Answer


<!DOCTYPE html>
<html>
<body>
  <div id="Output"></div>
  <div id="Debug"></div>
    <script type='text/javascript'>
    <!--from w  w  w  .  ja v a 2s . c  o m-->
        var date1 = new Date();
        var oDiv = document.getElementById("Output");
        var arrData = [];
        for (var i = 0; i <= 5000; i++)
            arrData.push(i);
        oDiv.innerHTML = arrData.join(", ");
        var date2 = new Date();
        document.getElementById("Debug").innerHTML = "Took " + (date2.getTime() - date1.getTime()) + " milliseconds";
    
    </script>
</body>
</html>

The code above is rendered as follows: