{"version":3,"sources":["main.js"],"names":["html","document","querySelector","style","string","n","console","log","length","string2","step","setTimeout","innerHTML","substring","window","scrollTo"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAIA,OAAOC,SAASC,aAAT,CAAuB,OAAvB,CAAX;AACA,IAAIC,QAAQF,SAASC,aAAT,CAAuB,QAAvB,CAAZ;AACA,IAAIE,k7CAAJ;AA8CA,IAAIC,IAAI,CAAC,CAAT;AACAC,QAAQC,GAAR,CAAYH,OAAOI,MAAnB;AACA,IAAIC,UAAU,EAAd,EAAuB;AACvB,IAAIC,OAAO,SAAPA,IAAO,GAAI;AACXC,eAAW,YAAI;AACXN,YAAIA,IAAI,CAAR;AACAC,gBAAQC,GAAR,CAAYH,OAAOC,CAAP,CAAZ;AACA,YAAGD,OAAOC,CAAP,MAAc,IAAjB,EAAsB;AAClBI,uBAAW,MAAX;AACH,SAFD,MAEM,IAAGL,OAAOC,CAAP,MAAa,GAAhB,EAAoB;AACtBI,uBAAW,OAAX;AACH,SAFK,MAGD;AAAEA,uBAAWL,OAAOC,CAAP,CAAX;AAAuB;AAC9BL,aAAKY,SAAL,GAAiBH,OAAjB;AACAN,cAAMS,SAAN,GAAkBR,OAAOS,SAAP,CAAiB,CAAjB,EAAmBR,CAAnB,CAAlB;AACAS,eAAOC,QAAP,CAAgB,CAAhB,EAAkB,IAAlB;AACAf,aAAKe,QAAL,CAAc,CAAd,EAAgB,IAAhB;AACAV,YAAE,CAAF,GAAID,OAAOI,MAAX,GAAoBE,MAApB,GAA4B,EAA5B;AACH,KAdD,EAcE,CAdF;AAeH,CAhBD;AAiBAA,QAAQ","file":"main.cb8195fd.map","sourceRoot":"..\\src","sourcesContent":["let html = document.querySelector('#html')\r\nlet style = document.querySelector('#style')\r\nlet string = `\r\n/*你好,我是一名前端新人泽帅\r\n*接下来我要展示一下我前端功底\r\n*首先我要准备一个div\r\n*/\r\n#div1{\r\n    border: 1px solid red;\r\n    width: 200px;\r\n    height: 200px;\r\n}\r\n/** 接下来我把 div 变成一个八卦图\r\n * 注意看好了\r\n * 首先把 div 变成一个圆\r\n **/\r\n#div1{\r\n    border-radius : 50%;\r\n    box-shadow: 0 0 3px rgba(0,0,0,0.5);\r\n    border : none;\r\n}\r\n/** 八卦是阴阳形成的\r\n *  分别代表一黑一白\r\n **/\r\n#div1{\r\n    background: linear-gradient(90deg, rgba(255,255,255,1) 50%, rgba(0,0,0,1) 50%);\r\n}\r\n/** 接下来我将融入两个神秘的能量球\r\n **/\r\n#div1::before{\r\n    width: 100px;\r\n    height: 100px;\r\n    top: 0;\r\n    left: 50%;\r\n    transform: translate(-50%);\r\n    background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 25%, rgba(0,0,0,1) 25%, rgba(0,0,0,1) 100%);\r\n    border-radius: 50%;\r\n}\r\n#div1::after{\r\n    width: 100px;\r\n    height: 100px;\r\n    bottom: 0;\r\n    left: 50%;\r\n    transform: translate(-50%);\r\n    background: radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 25%, rgba(255,255,255,1) 25%, rgba(255,255,255,1) 100%);\r\n    border-radius: 50%;\r\n}\r\n`; \r\nlet n = -1     \r\nconsole.log(string.length)  \r\nlet string2 = ''       //定义一个新字符串\r\nlet step = ()=>{\r\n    setTimeout(()=>{\r\n        n = n + 1\r\n        console.log(string[n])\r\n        if(string[n] === '\\n'){       \r\n            string2 += '<br>'\r\n        }else if(string[n] ===' '){\r\n            string2 += '&nbsp'         \r\n        }\r\n        else { string2 += string[n]  }\r\n        html.innerHTML = string2\r\n        style.innerHTML = string.substring(0,n)\r\n        window.scrollTo(0,9999)\r\n        html.scrollTo(0,9999)\r\n        n+1<string.length ? step() :{}    \r\n    },0)\r\n}\r\nstep()  //执行\r\n\r\n\r\n"]}