1

Estou tentando converter o seguinte código jQuery sem sucesso para javascript puro:

$.each($("p"), function(i, el) {
  var el = $(el);
  el.html(el.html() + " - " + i);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>

<p>Teste</p>
<p>Teste</p>
<p>Teste</p>
<p>Teste</p>
<p>Teste</p>

O que consegui fazer até agora foi:

var elements = document.querySelectorAll("p");

Array.prototype.forEach.call(elements, function(el, i){
    var el = el;
    var teste = el.innerHTML += 
    teste " - " + i;
});
1
  • Já agora, ainda no JQuery, mais idiomático seria $("p").each(
    – Isac
    Commented 4/02/2020 às 10:23

1 Resposta 1

3

Não é necessário declarar as variáveis el e teste, apenas o trecho que concatena a variável i no el.innterHTML seria o suficiente para o código funcionar, na verdade elas que não estão permitindo o código funcionar corretamente:

Array.prototype.forEach.call(elements, function(el, i){
    el.innerHTML += " - " + i;
});

Utilizar o prototype do Array também não é necessário, visto que a variável elements já é iterável:

elements.forEach( (el, i) => {
  el.innerHTML += " - " + i;
});

O código final seria algo assim:

document.querySelectorAll("p").forEach( (el, i) => {
  el.innerHTML += " - " + i;
});
<p>Teste</p>
<p>Teste</p>
<p>Teste</p>
<p>Teste</p>
<p>Teste</p>

Veja que aqui, nem mesmo declarei a variável elements, deixando um outro exemplo do que pode ser feito, efetuando o forEach diretamente no retorno da querySelectorAll.

2

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .