javascript - 带有边框/周边的按钮作为加载器？

Question

撇开实际的网络集成方面不谈，什么是最好的 css/javascript 技术来创建一个按钮，其周边/边框是加载器，如下图:

Answer 1

这是你要找的吗？

.rect {
  fill:green;
  stroke-width:3;
  stroke:yellow;
  border-radius: 10%;
  stroke-dashoffset: -50px;
  animation: loader-animation 4s linear;
}

@keyframes loader-animation {
  0% {
    stroke-dasharray: 0, 400px;
  }
  100% {
    stroke-dasharray: 400px, 0;
  }
}

<svg>
  <rect class="rect" x="10" y="10" rx="5" width="100" height="100"/>
</svg>