HTML部分

<h1 id="text"></h1> //结构部分只需要一个容器

css部分

{
  box-sizing: border-box;
}

body {
  background-color: darksalmon;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  margin: 0;
  text-align: center;
  color: #ffff;
}

JS部分

const prog = 'when you have that point of view,the world becomes your library to help you become better at your craft .';
let index = 1;
//使用slice方法,两个参数,第一个是开始,第二个是结束。
function writeText() {
  text.innerText = prog.slice(0, index);
  index++;
  //若index值比字符串的长度长,说明已经放完,需要重新开始放(否则就会停住)
  if (index > prog.length) {
    index = 1;
  }
}
// 每隔0.3s调用一次函数
setInterval(writeText, 300);

小彩蛋:上面的英文出自科比,翻译过来就是:当你确立一个你非实现不可的目标之后，世界就变成了一座帮你提升水平，精进技艺的图书馆。