模仿终端打字效果

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_39542027/article/details/83275542

• 模仿终端打字效果
  …

<script type="text/javascript"> 
var charIndex = -1;
var stringLength = 0;
var inputText;
function writeContent(init){
    if(init){
        inputText = "Waiting...<br> Connecting To OmegaXYZ.com...<br>Connection Established.<br>Copyright (c) 2018 OmegaXYZ.com All Rights Reserved.<br>[root@host~] Login : xyjigsaw<br>[root@host~] password : ******<br>[root@host~] Access Is Granted！<br>//欢迎访问OmegaXYZ.com<br>[root@host~] Attention:请查找时简化关键字~";
    }
    if(charIndex==-1){
        charIndex = 0;
        stringLength = inputText.length;
    }
    var initString = document.getElementById('myContent').innerHTML;
    initString = initString.replace(/<SPAN.*$/gi,"");

    var theChar = inputText.charAt(charIndex);
    var nextFourChars = inputText.substr(charIndex,4);
    if(nextFourChars=='<BR>' || nextFourChars=='<br>'){
        theChar  = '<BR>';
        charIndex+=3;
    }
    initString = initString + theChar + "<SPAN id='blink'>_</SPAN>";
    document.getElementById('myContent').innerHTML = initString;

    charIndex = charIndex+1;
    if(charIndex%2==1){
         document.getElementById('blink').style.display='none';
    }else{
         document.getElementById('blink').style.display='inline';
    }

    if(charIndex<=stringLength){
        setTimeout('writeContent(false)',50);
        }else{
            blinkSpan();
        }  
}

var currentStyle = 'inline';
function blinkSpan(){
    if(currentStyle=='inline'){
    currentStyle='none';
    }else{
    currentStyle='inline';
    }
    document.getElementById('blink').style.display = currentStyle;
    setTimeout('blinkSpan()',500);

}
</script>

…