Trying to line up my output

eyerate · 10-15-2012, 05:03 PM

Hello every body,

Trying to format my out put numbers. I know how in java but i guess JavaScript is different.

Example:

I want

Code:

                
1  3  5  7  9      
11 13 15 17 19      
21 23 25 27 29

I have
1 3 5 7 9
11 13 15 17 19
21 23 25 27 29

Here is my Code

Code:

<SCRIPT LANGUAGE="JavaScript">
		
		<!--
		
		for (var i = 1; i < 30; i++ )
		{
			if (i%2 == 1)
			{
				document.writeln(i);
				
					if (i==9)
					{
					document.write("<br>");		
					}

					if (i==19)
					{
					document.write("<br>");
					}
			}
		}

		document.write("<hr />");	
		//-->
		
		</SCRIPT>

Any help or hints most appreciated. Thanks for your Time!

EYERATE

devnull69 · 10-15-2012, 05:17 PM

Hints

1 - Don't use document.write (try modern DOM manipulation methods like .createElement, .appendChild, .insertBefore or even .innerHTML)
2 - Use a table with no border

Code:

<table border="0">
  <tbody>
    <tr>
      <td>First row, first column</td>
      <td>First row, second column</td>
      <td>...</td>
    </tr>
    <tr>
      <td>Second row, first column</td>
      <td>...</td>
    </tr>
    <tr>
      ...
    </tr>
  </tbody>
</table>

eyerate · 10-15-2012, 05:45 PM

thanks for reply still not working for me, I could use tables but I'm trying to figure out how to justify output in java Script.

eyerate · 10-15-2012, 07:37 PM

OK I figured out away to do it if any on else has my problem. I used spaces between the single digit numbers. If their is a proper way to do it , I'm all ears but here is what I did.

Code:

for (var i = 1; i < 30; i++ )
		{
			if (i%2 == 1)
			{
				document.writeln(i + "&nbsp");

					if (i < 10)
					{
					document.write("&nbsp;&nbsp;");
					}
					if (i==9)
					{
					document.write("<br>");		
					}

					if (i==19)
					{
					document.write("<br>");
					}
			}
		}

		document.write("<hr />");

so pretty much just add spaces to any number (< 10)

Code:

if (i < 10)
{
document.write("&nbsp;&nbsp;");
}

xelawho · 10-15-2012, 08:56 PM

as has been noted, to do this "properly" you would probably create elements and align them using css, like this:

Code:

<head>
<style>
span{
width:30px;
float:left}
</style>
</head>
<body>

<script type="text/javascript">
for (var i = 1; i < 30; i++ ){
			if (i%2 == 1){
			var sp=document.createElement("span");
			sp.innerHTML=i+" ";
			document.body.appendChild(sp)
			if (i==9||i==19){
		document.body.appendChild(document.createElement("br"));
		}
	}
}
document.body.appendChild(document.createElement("br"));
document.body.appendChild(document.createElement("hr"));
</script>
</body>

but if you're just looking for quick and sleazy, but want to get away from document.write:

Code:

<script type="text/javascript">
for (var i = 1; i < 30; i++ ){
			if (i%2 == 1){
			if (i<10){
			document.body.innerHTML+=i+"&nbsp;&nbsp;&nbsp;"
			} 
			if (i>10){
			document.body.innerHTML+=i+"&nbsp;"
			} 
			if (i==9||i==19){
			document.body.innerHTML+="<br>"
		}
	}
}

document.body.innerHTML+="<hr>"
</script>