Writing effect using javascript, setInterval does not work

The error is in two parts:

1 setInterval.

  

setInterval(escrever("teste"), 1000);

The correct one is

  

setInterval(function(){escrever("teste")}, 1000);

2 repetition loop.

  

for (i = 0; i < text.length; i++)

Here he will always write everything he has in text

Below the changes:

partText = "";
var index=-1;
function escrever(text) {   

    index++;

    if(index<text.length){    
      partText += (text.charAt(index));   
      document.getElementById("texto").innerHTML = partText;
    }  
    else
    {
      clearInterval(timer);
    }

  }

var timer= setInterval(function(){escrever("teste")}, 1000);

Example | jsfidlle

You can do this:

function escrever(text) {
    var el = document.getElementById("texto");
    for (i = 0; i < text.length; i++) {
        setTimeout(function(letra) {
            el.innerHTML += letra;
        }, 1000 * i, text[i]);
    }
}
escrever('teste');

<div id="texto"></div>

jsFiddle: link

Please note:

• uses += to add HTML. Only = will replace everything
• avoid document.getElementByID within for , this is heavy for the browser. Cache as I did in the example.

setInterval may not be good, because it repeats indefinitely (until it is determined that it stops with clearInterval ). What I recommend is that you use setTimeout that runs only once.

With this, your code would look something like this:

var partText = "";
function escreverNoObjeto (objeto, texto) {
    objeto.innerHTML = texto;
}

function escrever(text, intervalo) {
    var partText = '';
    var fn = function(texto) {
        return function() {
            /* pode ser document.getElementById("texto")*/
            escreverNoObjeto(document.body, texto);
        };
    };

    for (i = 0; i < text.length; i++) {
        partText += text.charAt(i);

        setTimeout(fn(partText), intervalo * (i + 1));
    }
}

escrever("teste", 1000);

You can still see it working in JSFiddle

I hope I have helped \ o /

Parameters are not passed as you are doing:

Try:

setInterval(escrever, 1000, 'test');

Example on jsfiddle .

I do not know if this is what you want but the impression of each letter is instantaneous, only in the whole str you notice it.

To make letter to letter:

...
<p id="texto"></p>
...

var testStr = 'Vamos lá escrever isto';
function escrever(i) {
    partText = testStr.charAt(i);   
    document.getElementById("texto").innerHTML += partText;
    i += 1;
    if(i < testStr.length) {
        setTimeout(escrever, 400, i); // timing entre cada impressão aqui
    }
}

index_da_letra = 0;
escrever(index_da_letra);

Example on jsfiddle :