有没有更有效的方法来写这个？

刚刚在我的教练想出的一个学校项目上工作，应该是用伪代码编写的，但我正在更进一步，并将其写入javascript/html以构建一个功能性网站。基本上，有一个假设的学校有9个等级，每个等级3个教室，每个班级9个月。我应该写一个伪代码脚本来为每个教室生成帐单 - 幼儿园每月80美元，其余的每个月60美元，直到8年级。有没有更有效的方法来写这个？

无论如何，我很好奇，如果有更好的方法来编写这段代码并列出每个月的账单 - 教师布置代码的方式，我必须写这27次（每次教室3次9年级），幼儿园每月80美元，其余课程每月60美元。这是我到目前为止有：

<body> 
    <script> 
     var x = 0; 
     var y = 1; 
     var i; 
     var theMonths = ["January", "February", "March", "April", "May", 
      "June", "July", "August", "September"]; 

     function javascript() { 
      for (i = 0; i < 10; i++) { 
       document.getElementById("td1").innerHTML += theMonths[0]; 
       document.getElementById("td2").innerHTML += theMonths[1]; 
       document.getElementById("td3").innerHTML += theMonths[3]; 
       document.getElementById("td4").innerHTML += theMonths[4]; 
       document.getElementById("td5").innerHTML += theMonths[5]; 
       document.getElementById("td6").innerHTML += theMonths[6]; 
       document.getElementById("td7").innerHTML += theMonths[7]; 
       document.getElementById("td8").innerHTML += theMonths[8]; 
       document.getElementById("td1a").innerHTML += "$60"; 
       document.getElementById("td2a").innerHTML += "$60"; 
       document.getElementById("td3a").innerHTML += "$60"; 
       document.getElementById("td4a").innerHTML += "$60"; 
       document.getElementById("td5a").innerHTML += "$60"; 
       document.getElementById("td6a").innerHTML += "$60"; 
       document.getElementById("td7a").innerHTML += "$60"; 
       document.getElementById("td8a").innerHTML += "$60"; 
       return false; 
      } 
     } 
    </script> 
    <div id="demoDiv"> 
     <p id="demo">Your coupons:</p> 
     <table> 
      <tr> 
       <th scope="col">Month:</th> 
       <th scope="col">Price:</th> 
      </tr> 
      <tr> 
       <td id="td1"></td> 
       <td id="td1a"></td> 
      </tr> 
      <tr> 
       <td id="td2"></td> 
       <td id="td2a"></td> 
      </tr> 
      <tr> 
       <td id="td3"></td> 
       <td id="td3a"></td> 
      </tr> 
      <tr> 
       <td id="td4"></td> 
       <td id="td4a"></td> 
      </tr> 
      <tr> 
       <td id="td5"></td> 
       <td id="td5a"></td> 
      </tr> 
      <tr> 
       <td id="td6"></td> 
       <td id="td6a"></td> 
      </tr> 
      <tr> 
       <td id="td7"></td> 
       <td id="td7a"></td> 
      </tr> 
      <tr> 
       <td id="td8"></td> 
       <td id="td8a"></td> 
      </tr> 
     </table> 
    </div> 
    <input type="button" value="Go!" onclick="javascript();" /> 
</body>

有没有办法简化这个，所以我不必复制/粘贴一切的27倍，并用不同的ID的27代个体表为TD项目？

如果你能解决这个问题对我来说 - 你真棒：d

来源

2015-10-19 Mark

您可以在JavaScript中生成允许使用内部循环的表格。 – FakeRainBrigand

响应将取决于目标浏览器。我个人会使用'Date.prototype.toLocaleString'来解决这个问题。 – Knu

创建伪代码的想法是识别需求并识别重复功能。如果你做了psuedocode，你会意识到解决方案是一些变量和几个循环。 – jeff

您可以使用for如下填充表中的数据

变量x和y在不使用总之，去除他们
删除从forreturn false;这是导致循环运行一次，然后从函数返回控制
使用的厕所p变量i得到的元件的动态顺序ID和从阵列
移除从innerHTML+=从添加按钮重复的数据，以防止相应的元件点击
使用的硬编码值8遍历所有元素应该是动态的并且等于数组的长度。

Demo

var theMonths = ["January", "February", "March", "April", "May", 
    "June", "July", "August", "September"]; 

function javascript() { 
    for (var i = 0; i < 8; i++) { 
     document.getElementById("td" + (i + 1)).innerHTML = theMonths[i]; 

     document.getElementById("td" + (i + 1) + "a").innerHTML = "$60"; 
    } 
}

来源

2015-10-19 03:42:20 Tushar

抱歉，变量x和y来自我在做这件事时的先前尝试，我忘记删除它们。感谢捕捉:) 而且，返回false是从以前的尝试列表中添加表之前添加的月份添加返回false。我想这里有一堆我忘记清理的代码。无论如何，这看起来很棒，我会尽快试用。我仍在学习JavaScript，有点新奇，所以我非常感谢帮助：D再次感谢。 – Mark

知道我可以稍后重用[i]变量真的很好，我不知道那个（document.getElementById（“td”+（i + 1））。我做了大约30分钟的搜索，随时随地都可以找到 - 也许我并没有问正确的问题，现在我明白了，这样做更有意义。再次感谢，绝对是最好的回答:) – Mark

@Mark欢迎:)很高兴为您提供帮助。 – Tushar

我真的不你应该怎么做，所以我就满足你实际上是在做什么。在没有其他输入的情况下，我没有看到按钮的位置，所以我刚刚将脚本移动到要修改的DOM元素下面，并且正在生成重复的列。

<body> 
    <div> 
     <p> Your coupons: </p> 
     <table> 
      <tbody id=demoTable> 
      <tr> 
       <th scope="col"> Month: </th> 
       <th scope="col"> Price: </th> 
      </tr> 
      </tbody> 
     </table> 
    </div> 
    <script> 
     (function() { 
     function td(text) { 
      var column = document.createElement('td') 
      column.textContent = text 
      return column 
     } 

     var table = document.getElementById('demoTable'), 
      months = 
       [ "January", "February", "March", "April", "May", 
       "June", "July", "August", "September" ] 
     months.forEach(function(month) { 
      var row = document.createElement('tr') 
      row.appendChild(td(month)) 
      row.appendChild(td('$60')) 
      table.appendChild(row) 
     }) 
     })() 
    </script> 
</body>

来源

2015-10-19 04:01:45

有没有更有效的方法来写这个？

回答

相关问题