SVG元素可以像其他HTML元素一样在JavaScript中操作。在这个例子中,我们使用了一段简短的代码来显示时钟上的实际时间。我们在JavaScript中使用 getElementById 访问时针和分针,然后设置它们的 transform 属性反映当前时间的旋转。
这里还有一个技巧值得一提。这里表示每个小时的点被画成虚线圆圈。这类似于我们可以为常规HTML元素设置 border-style CSS属性,但更复杂。在SVG中,我们可以使用 stroke-dasharray 属性微调每个横线的长度和间距。我们也可以使用 stroke-dashoffset 设置偏移量。