实现根据页面id值不同显示不同内容的打字机效果

接一客户任务，要实现打字机效果并且打字机内容有三类，需要实现，其实打字机效果实现起来还是很简单，直接js利用数组分段显示就可以。
打字机效果：


 
实现的话直接可以在前端页面调用js 然后在body 引用函数就可以了。在需要显示的地方放置一个表单，然后适当美化一下就完成。
表单代码如下：

<form name=tickform style="margin:10px auto; width:40%; height:auto;">

<textarea name=tickfield  style="background-color: rgb(0,0,0); color: rgb(255,255,255); cursor: default; font-family: Arial; font-size: 16px; width:100%; padding:10px 20px; height:100px;border-radius:15px;" wrap=virtual>liulinyuan:资源载入中</textarea>

</form><div id="xianshi" style="display:none">typinga</div>

这里面需要注意的是代码：

<div id="canshu" style="display:none">typinga</div>

这个代码起的作用是指导js执行显示哪个数组的 typinga 不同，显示的内容就有可能不同，这时候需要注意空值的处理
然后在js端获取id的内容：

var canshu = document.getElementById('xianshi').innerText;

获取id内容之后，就可以直接逻辑判断执行了
 
首先把数组名称放置到一个数组内，然后用获得的id值和数组内的值进行比对，如果存在 就直接赋值，否则就给另外的值
这样就可以完成根据id值显示不同内容了

var arr = ["typinga", "typingb", "typingc"];

if (arr.toString().indexOf(xianshi) > -1) {

      

   shuzu=canshu;

    }

else{

shuzu=typingd;

}

这里面出现的一个问题是，把字符串转换为变量，直接用eval()转换就可以
任务完成，天已经黑了