How to add space to end of line in Javascript

I am writing a program that creates oblique d based on user input. The program asks for the number of lines and accordingly displays the result. If the user enters 5, he should output:

d
 d
  d
   d

My actual conclusion is:

d
d
d
d

Here is my Javascript code:

spaceArray = []; 
space = ' '; 
spaceMain = ' ';


function processingFunction(rows){ //passes the input as variable rows
    var spaceCounter = 0;          
    var counter = 0;               

    while (counter<rows){    
        while (spaceCounter<counter){ 
            spaceMain = spaceMain + space;  //adds a space before the d
            spaceCounter++;         
        }
        counter++; 
        spaceCounter=0; 
        spaceArray.push(spaceMain);  //adds spaceMain to the end of spaceArray
        spaceMain = ' '; 
    }

    for (i = 0; i<rows; i++){
        d = spaceArray[i]+"d<br>";
        document.getElementById("outputNumber1").innerHTML += d;                                                                                                   
    }

}

When I replace the string of a space variable from '' to '-', it works with the output:

d
-d
--d
---d

I'm not sure what I need to change to get the above output, but instead of spaces instead of spaces.

HTML:

<!DOCTYPE>
<html>
<head>
</head>
<style>
    body{background-color: green;} 

</style>

<body>
    <center><h2>Slanted d</h2></center>
    <h3>Input the number of rows you would like your slanted d to be in the input text box</h3>
    <input type="text" id="inputNumber"></input> 
    <button type="button" onclick="processingFunction(document.getElementById('inputNumber').value)">Create slanted d</button> 
    <br><br>
    <output type="text" id="outputNumber1"></output>

<script src="slantedDJS.js"></script>

</body>
</html>
+4
source share
4 answers

By default, the browser "collapses" all spaces into one space.

<pre> . :

<pre type="text" id="outputNumber1"></pre>

<pre> . , .

, CSS white-space:pre , . :

<output type="text" id="outputNumber1" style="white-space:pre;"></output>

<style> :

<style>
    body{background-color: green;} 
    #outputNumber1{white-space:pre;}
</style>
+2

html- &nbsp;, , , . :

space = '&nbsp;'; 
+7

 , . html.

+1

nbsp, html.

+1

Source: https://habr.com/ru/post/1671457/


All Articles