函数的代码显示在网页的顶部

Function's code displays at top of webpage

本文关键字：网页 顶部 显示 代码 函数      更新时间：2023-09-26

我试图让我的函数在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标签，我把它在?

感谢您的任何帮助或任何建议!

脚本生成正方形并将其放入

 <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>
相关文章：