input placeholder信息输入效果

可能经常会在某些新闻或视频网站的搜索框看到类似打字机的效果，咋眼一看好像很简单，但是一些又说不上具体细节，如下图

一眼一看，这不动态改变 placeholder 的值就好了吗？仔细看人家还有一个类似光标的东西呢，其实也简单，在拼接的时候再拼接个 | 不就好了吗？

代码如下：

const input = document.getElementById('input')
		
		let str = '女子否认拔病人尿管女子否认拔病人尿管'
		let str2 = ''
		let strArr = str.split('')
       // 也可以用 Array.prototype.slice.call(str) 将字符串转为数组
		
		let number = 0
		let timer = null

		function add(arr,time = 1000) {
			timer =  setInterval(() => {
				if(timer && number == strArr.length) {
					clearInterval(timer)
					timer = null
					return
				}
				str2 += `${arr[number]}`

				input.placeholder = str2 +  (number ==  (strArr.length - 1) ?  '' : '|')
				number++
			},time)
		}
		add(strArr,140)

主要的思路就是将 新闻字符串分割为数组，通过定时器去不断组装的 placeholder，只需注意在在其末尾 添加 |，和最后一个时取消拼接就好了。

主要还是解决问题的思路，遇到问题多观察，就能发现人家是怎么做的，找到好的解决方案