使用 document.write 将 html 表添加到 javascript

Question

在这里寻求帮助。 我们的班级讲师要求我们使用 document.write 将表格添加到 javascript 中，我知道这不是推荐的方法，但这是我们的讲师正在寻找的：将代码添加到写入开头的 writeIt 函数table 标签，然后遍历 heros 和 villians，然后是结束 table 标签。 然后修改makeListItem，返回tr td Hero td td Villan /td /tr形式的字符串。

我试过这个，但在尝试查看时得到一个空白的 html 页面。

 <!DOCTYPE html> <html> <head> <title>JavaScript Functions</title> <meta charset="utf-8" /> <script> var superData = {"Super Man":["Lex Luther"], "Bat Man":["Joker", "Riddler",], "Spider Man":["Green Goblin", "Vulture", "Carnage"], "Thor":["Loki", "Frost Giants"]}; function writeIt('<table>'){ for (hero in superData){ var villains = superData[hero]; for (villainIdx in villains){ var villain = villains[villainIdx]; var listItem = makeListItem(<tr><td>Hero</td><td>Villan</td></tr>); document.write(listItem); } } } function makeListItem(name, value){ var itemStr = "<li>" + name + ":&nbsp;" + value + "</li>"; return itemStr; } document.write('</table>'); </script> </head> <body onload="writeIt()"> </body> </html>

Answer 1

尝试这个：

 <!DOCTYPE html> <html> <head> <title>JavaScript Functions</title> <meta charset="utf-8" /> <script> var superData = { "Super Man": ["Lex Luther"], "Bat Man": ["Joker", "Riddler", ], "Spider Man": ["Green Goblin", "Vulture", "Carnage" ], "Thor": ["Loki", "Frost Giants"] }; function writeIt() { document.write('<table>'); for (hero in superData) { document.write("<tr><td>" + hero + ": <ul>"); var villains = superData[hero]; for (villainIdx in villains) { var villain = villains[villainIdx]; var listItem = makeListItem(villain); document.write(listItem); } document.write("</ul></td></tr>"); } } function makeListItem(value) { var itemStr = "<li>" + value + "</li>"; return itemStr; } document.write('</table>'); </script> </head> <body onload="writeIt()"> </body> </html>

Answer 2

我试过这个，但在尝试查看时得到一个空白的 html 页面。

因为你有语法问题。 使用 F12 或 Inspector/Developer 模式找出原因。

我们的班级讲师要求我们使用 document.write 在 javascript 中添加一个表格，我知道这不是推荐的方法，但这是我们的讲师正在寻找的

的确，它经常被人反对，但 JavaScript 使它可用是有原因的，所以让我们使用它。

第一个问题是你好像调换了一些代码...

例如，您有function writeIt('<table>') 。 我想你的意思是document.write('<table>'); .

function writeIt(){
   document.write('<table>');

接下来，您将在函数调用之外获得最终的document.write 。

    document.write('</table>');

这应该在writeIt()内部，就在您的 for 循环之后。

最后，你的循环中有一些未引用的东西......

makeListItem(<tr><td>Hero</td><td>Villan</td></tr>);

应该是（单引号或双引号）：

makeListItem('<tr><td>Hero</td><td>Villan</td></tr>');

但这对于一张桌子来说仍然有点不对劲。 例如，超人与他的恶棍的比例为 1:1，而蝙蝠侠的比例为 1:2。 您应该以更可预测的方式添加行和表，但以上内容至少会开始为您提供输出。

最后，需要注意的是，您的makeListItem在使用<li>之前需要使用<ul> ，因此需要解决这些问题。 现在，我建议您只是将数据吐出并稍后对其进行格式化。

使用 document.write 将 html 表添加到 javascript

问题描述

2 个解决方案

解决方案1
0 2018-02-05 17:44:45

解决方案2
0 2018-02-05 18:05:19

使用 document.write 将 html 表添加到 javascript

问题描述

2 个解决方案

解决方案1 0 2018-02-05 17:44:45

解决方案2 0 2018-02-05 18:05:19

解决方案1
0 2018-02-05 17:44:45

解决方案2
0 2018-02-05 18:05:19