3

Come eu faço para pegar o id no JavaScript que, no HTML, está data-id="2" ?

<ul>
  <li data-id="1" id="e1">Elemento 1</li>
  <li data-id="2" id="e2">Elemento 2</li>
  <li data-id="3" id="e3">Elemento 3</li>
</ul>

Por exemplo, para o HTML acima, gostaria de receber o id e2, visto que esse é o que possui data-id="2".

5
  • Porquê o negativo? Todo mundo já deve nascer sabendo como faz isso? 3/07/2018 às 16:19
  • TheCoder, poderia confirmar se você precisa buscar o elemento que possui data-id=2 ou o que você quer é o valor 2?
    – Woss
    3/07/2018 às 16:23
  • quero ir buscar se algum elemento possui data-id=2
    – tomas
    3/07/2018 às 16:24
  • Poderia pegar pelo id direto, não?
    – Sam
    3/07/2018 às 16:30
  • O id é so de exemplo. Eu tou a criar uma API em que o outro programador pode criar o seu próprio botão, basta so colocar este atributo para ele funcionar
    – tomas
    3/07/2018 às 16:32

2 Respostas 2

5

Em puro javascript pode ser asssim:

document.querySelectorAll("[data-id='2']")

Como irá retornar um array de elementos, precisa verificar se retornou algum, e pegar o primeiro elemento, em seguida o id:

document.querySelectorAll("[data-id='2']")[0].id
1
  • Obrigado pela ajuda, eu uso js puro!
    – tomas
    3/07/2018 às 16:15
4

Pode usar o document.QuerySelector com o seletor data-id='2'.

Esta função irá retornar um elemento que atenda ao seletor, caso não exista nenhum elemento que atenda à condição será retornado null.

var elemento = document.querySelector("[data-id='2']");
console.log(`id: ${elemento.id} \ndata-id: ${elemento.dataset.id}`);
<ul>
  <li data-id="1" id="e1">Elemento 1</li>
  <li data-id="2" id="e2">Elemento 2</li>
  <li data-id="3" id="e3">Elemento 3</li>
</ul>

1
  • Obrigado pela ajuda!
    – tomas
    3/07/2018 às 16:16

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 .