如何实现鼠标点击出现文字?

如何实现鼠标点击屏幕出现文字?

请粘贴复制以下代码到编辑器查看效果 :）

(function() {
  let arr=["富强","民主","文明","和谐","自由","平等","公正","法治","爱国","敬业","诚信","友善"]
  let flag=true
  document.body.addEventListener('click',function(e) {
 
    if(flag) {
      let X=e.pageX;  //字体的x坐标
      let Y=e.pageY;  //字体的y坐标
      let curT=Y;
      let curF=20;  //字体的大小
      let curO=1;    //opacity
      // 随机出现的标题
      let title=arr[Math.floor(Math.random()*12)]
      let span=document.createElement('span')
      span.className='idName'
      span.innerText=title
      //初始化节点
      span.style.position="fixed"
      span.style.top=curT+'px';
      span.style.fontSize=curF+'px'
      span.style.opacity=curO;
      span.style.left=X+'px';
      document.body.appendChild(span)
      let a=document.getElementsByClassName('idName')[0]
 
      // 随机颜色
      a.style.color='rgb('+Math.floor(Math.random()*225)+','+Math.floor(Math.random()*225)+','+Math.floor(Math.random()*225)+')'
      // console.log(a)
      // 开启定时器
      this.timer=setInterval(() => {
        curT-=10;
        curF+=1
        curO-=0.1
        a.style.top=curT+'px';
        a.style.fontSize=curF+'px'
        a.style.opacity=curO;
      },50)
      setTimeout(() => {
        // 清除定时器
        clearInterval(this.timer)
        document.body.removeChild(a)
        flag=true
      },500)
      flag=false
    }
 
  })
})()<br>//注意请复制到<script></script>里面:)