在javascript中动态创建元素和类实现

我在使用innerHTML在javascript中动态创建元素存在问题。这里是代码：在javascript中动态创建元素和类实现

var newElement = document.createElement("tr"); 
newElement.innerHTML = ['<td><a href="javascript:void(0);">Test Suite</a></td><td>4,977</td><td class="text-align-center">', 
         '<div class="sparkline txt-color-blue text-align-center" data-sparkline-height="22px" data-sparkline-width="90px" data-sparkline-barwidth="2">2700, 3631, 2471, 1300, 1877, 2500, 2577, 2700, 3631, 2471, 2000, 2100, 3000</div>', 
      ].join('\n'); 

$("#locationsGraph").append(newElement);

问题是元素创建恰到好处，但元素类没有实现。

本部分：

class="sparkline txt-color-blue text-align-center" data-sparkline-height="22px" data-sparkline-width="90px" data-sparkline-barwidth="2"

我应该得到一个柱状图，而是我得到相同的数字列表。

这是在innerHTML中实现类的东西还是什么？我也尝试手动创建所有元素并指定className但结果相同

来源

2015-01-14 autodev101

想必您使用创建图表没有新创建的元素上运行什么都。您可能需要再次调用它才能将DOM转换为实际的图表。 –

这些数字究竟是如何形成一个“条形图”？你可能需要调用一些方法来做到这一点... – haim770

这只是一个内联barGraph的演示，这些数字是酒吧的随机数字。 – autodev101

根据the docs，您需要运行$(newElement).find('div').sparkline()。

来源

2015-01-14 15:09:54

hooray成功:)）谢谢你，我是javascript/jquery的新手，我没有想到检查文档的sparkline。 – autodev101

@ autodev101：如果您在问题*中包含诸如您正在使用哪些工具（即sparkline）*的信息，未来您会发现您会获得更好的结果。 –

@MattBurland老实说，我甚至都不知道sparkline是一种工具，我正在模板上工作，而且我有一个截止日期，所以事情必须尽快完成，但将来我会。谢谢 – autodev101

你不必关闭，以配合您

newElement.innerHTML = ['<td><a href="javascript:void(0);">Test Suite</a></td><td>4,977</td><td class="text-align-center">', 
         '<div class="sparkline txt-color-blue text-align-center" data-sparkline-height="22px" data-sparkline-width="90px" data-sparkline-barwidth="2">2700, 3631, 2471, 1300, 1877, 2500, 2577, 2700, 3631, 2471, 2000, 2100, 3000</div>', 
      '</td>' //this is missing 
    ].join('\n');

来源

2015-01-14 15:30:30 sabkaraja

在javascript中动态创建元素和类实现

回答

相关问题