在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中動態創建元素和類實現

回答

相關問題