从html表值创建进度栏

Question

我需要帮助。我正在尝试基于另一个TD元素的值创建一个简单的进度条。这是我下面的代码。我希望<hr>的width属性值等于第一个<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设置它，而不是依靠用标签名来查找它。