javascript - Javascript查找并替换为变量

多亏了stackoverflow用户的帮助，我几乎可以做到这一点。我只需要一点帮助。

我有一个HTML页，其中包含动态生成的数据表，无法更改视图。这样返回：

<tr>
<td class="name">foo<</td>
<td class="time">5:36:13</td>
<td class="avtime">0:09:36</td>
<td class="transcripts">0</td><td class="views">35</td>
<td class="percent">100</td>
</tr>

我需要做的是找到并替换：

<td class="percent">$foo</td>

带有：

<td class="percent"><span class="bar" style="width:$foo%"></span></td>

正如我所说的，我快要在那里了，并且替代品不能与可变值一起使用。

我现在所拥有的：

function replaceScript() {
var toReplace = '<td class="percent">69</td>';
var replaceWith ='<td class="percent"><span class="bar" style="width:69%"></span>  </td>';
document.body.innerHTML = document.body.innerHTML.replace(toReplace, replaceWith);
}

你能帮我吗？

提前致谢

最佳答案

我建议不要执行这种DOM操作：

$("td.percent").each(function() {
    if (this.innerHTML == "69") {
        this.innerHTML = '<span class="bar" style="width:69%;"></span>';
    }
});

如果您希望直接从HTML中获取样式宽度并使用在那里找到的任何值，则可以这样做：

$("td.percent").each(function() {
    var widthVal = this.innerHTML;
    this.innerHTML = '<span class="bar" style="width:' + widthVal + '%;"></span>';
});