0

実行されたコードを div またはテーブル内に表示する関数を取得しようとしています。

現時点でコードが実行され、ページの上部に表示されます。ページの特定の領域に表示したい。どうすればいいですか?

「SquareScript.js」と呼ばれる私の外部スクリプト コードは次のとおりです。

function Display()
{   
   var a = document.getElementById("value1").value;
   var b = document.getElementById("value2").value;

   for(var i = 0; i < a;  i++)
   {
     document.getElementById("Paragraph").innerHTML += "  " +  
     document.getElementById("myValue").value; 
   }

   document.getElementById("Paragraph").innerHTML += "<br>";

   for (var r = 0; r < b; r++)
   {
     document.getElementById("Paragraph").innerHTML += " " +  
     document.getElementById("myValue").value;

     for(var p = 0; p < a-2; p++)
     {
       document.getElementById("Paragraph").innerHTML += "&nbsp&nbsp&nbsp";

     }
     document.getElementById("Paragraph").innerHTML += " " +  
     document.getElementById("myValue").value;
     document.getElementById("Paragraph").innerHTML += "<br>";

   }

   for(var i = 0; i < a;  i++)
   {
     document.getElementById("Paragraph").innerHTML += "  " +  
     document.getElementById("myValue").value; 
   }


}

私のコードは、ユーザーが入力した文字を使用して、ユーザーが入力した高さと幅の正方形をページ上に生成します。

ここに私のメインのウェブページのコードがあります:

<head> 
<link rel = "stylesheet" type = "text/css" href = "Assignment3.css">        

<style>
table {background-color:black;color:white; align: center;}
body {background-image: url('squares.png');}
</style>
</head>

<title>Generate A Square</title>

<body>
<p Id="Paragraph"></p>

<div class = "heading">
 <h1><img src = "Interested.png" width = 100px height = 100px></img>WELCOME TO BUILD A SQUARE</h1>
</div>

<table align = center>
<tr>
<td>
Please Enter value number 1:&nbsp&nbsp<input type = "text" id = "value1">
</td>
</tr>

<tr>
<td>
Please Enter value number 2:&nbsp&nbsp<input type = "text" id = "value2">
</td>
</tr>

<tr>
<td>
Enter a character for your square's border:&nbsp&nbsp<input type="text" Id="myValue">       </input>&nbsp;
</td>
</tr>

<tr>
<td>
<button onclick="Display()">Display</button>
</td>
</tr>
</table>

<div style = "margin-left: 45%;">
<button><a href = "MainMenu.html">Return To Main Menu</button> 
<script src = "SquareScript.js" ></script>
</div>

</body>

ご覧のとおり、テーブルの後にタグ内で外部スクリプトを呼び出しています。ただし、ページの上部に表示されます。

実行したスクリプトを、挿入した div タグ内に表示するにはどうすればよいですか?

助けや提案をありがとう!

4

1 に答える 1