SOURCE

var text=document.querySelector(".text");
var spe=document.querySelector(".speed");
var speed="300";
var flag=false;
var val=text.innerHTML;
let i=0;
text.innerHTML="";
a=setInterval(function() {
    if (i==val.length-1) {
        flag=true;
        clearInterval(a);
}
    text.innerHTML+=val[i];
    i++;
    
},speed)
spe.addEventListener("blur",function() {
    var speed=spe.value;
    console.log(speed);
    i=0;
    text.innerHTML="";
    if (flag==true) {
        a=setInterval(function() {
    if (i==val.length-1) {
    clearInterval(a);
}
    text.innerHTML+=val[i];
    i++;
},speed)
    }
    
})

<div class="con">
    <div class="text">Welcome to my website!</div>
</div>
<div class="box">
    <div class="btn">Speed</div>
    <input class="speed"/>
</div>

* {
    box-sizing: border-box;
}
.text {
    display: flex;
    justify-content: center;
    align-items: center;
}
.box {
     display: flex;
    justify-content: center;
    align-items: center;
    margin: 50px;
}
.btn {
    /* width: 20px; */
    height: 20px;
    background-color: lightblue;
    border: 1px solid #ccc;
    padding: 0 3px;
    font-size: 12px;
}
.speed {
    border: 0;
    width: 50px;
    height: 20px;
    background-color: lavender;
    
}