Question

我试图让我的函数在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标签中显示我执行的脚本？

感谢您提供任何帮助或任何建议！

Answer 1

您的脚本会生成正方形并将其放在

中

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

要将方块移动到具有脚本标记的div，请移动脚本标记下方的现有<p Id="Paragraph"></p>。 div代码将是

<div style = "margin-left: 45%;">
    <button><a href = "MainMenu.html">Return To Main Menu</button> 
    <script src = "SquareScript.js" ></script>
    <p Id="Paragraph"></p> <!-- move this p tag here -->
</div>

功能代码显示在网页顶部

1 个答案: