用js写了一个打字机效果,
其实并不是一个字一个字显示,
而是利用了interval,每隔300ms显示一次,造成视觉上的错觉。
虽然写的很辣鸡,但是还是很有意思哒!~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>打字机效果练习</title>
</head>
<body>
<div id="mytext" style="font-size: 30px"></div>
<script type="text/javascript">
var myt="js is amazing! let's do it!"; //输入文字
var mj=document.getElementById("mytext"); //定义要显示的文字
var i=0;
function change(){ //每隔0.3s执行一次函数
if(i<=myt.length){
mj.innerHTML=myt.substring(0,i); //每次多获取一个字符
i++;
}else{
window.clearInterval(interval);//清除时间间隔调用
}
}
var interval=window.setInterval(change,300);
</script>
</html>