html - 从 html 表值创建进度条

Question

我需要这方面的帮助。我正在尝试根据另一个 TD 元素的值创建一个简单的进度条。下面是我的代码。我希望 width 属性值<hr>等于在第一个<TD>元素上设置的值。

<table>
  <tr>
    <TD id="item">70%</td>
    <td width=200 style="border: 2px solid silver;padding:none">
      <hr style="color:#c00;background-color:#c00;height:15px; border:none;
                 margin:0;" align="left" width=50%;        />
    </td>
  </tr>
</table>

Answer 1

你可以做这样的事情

widthValue = document.getElementById("item").innerText;
document.getElementsByTagName("hr")[0].style.width = widthValue;

它将获取 的文本内容<td>，并将其设置为<hr>元素的宽度。您最好提供<hr>一个 id，因此您可以通过 id 设置它，而不是依赖于通过标签名称找到它。