Como seleciono um elemento no jQuery usando uma variável para o ID?

100

Por exemplo, o seguinte seleciona uma divisão com id = "2":

row = $("body").find("#2");

Como faço algo assim:

row_id = 5;
row = $("body").find(row_id);

A sintaxe acima produz um erro. Verifiquei a documentação do jQuery e as respostas aqui sem sucesso.

Tony
fonte
6
Uau, cinco respostas exatamente iguais ...
Zifre

Respostas:

189
row = $("body").find('#' + row_id);

Mais importante ainda, fazer o body.find adicional não tem impacto no desempenho. A maneira correta de fazer isso é simplesmente:

row = $('#' + row_id);
Rick Hochstetler
fonte
46

O caminho mais curto seria:

$("#" + row_id)

Limitar a busca ao corpo não traz nenhum benefício.

Além disso, você deve considerar renomear seus ids para algo mais significativo (e compatível com HTML de acordo com a resposta de Paolo), especialmente se você tiver outro conjunto de dados que precisa ser nomeado também.

John Rasch
fonte
Gosto de conciso. Acabei de usar isso com dicas de ferramentas qTip2, funciona muito bem. Estou um pouco curioso para saber qual é a penalidade de desempenho por gerar muitos desses "just in time", como em resposta à entrada do usuário.
PJ Brunet
26

Fazendo $('body').find();não é necessário quando se olha por ID; não há ganho de desempenho.

Observe também que ter um ID que começa com um número não é um HTML válido :

Os tokens de ID e NOME devem começar com uma letra ([A-Za-z]) e podem ser seguidos por qualquer número de letras, dígitos ([0-9]), hifens ("-"), sublinhados ("_") , dois pontos (":") e pontos (".").

Paolo Bergantino
fonte
6

Você pode fazer assim:

row_id = 5;
row = $("body").find('#'+row_id);
Amr Elgarhy
fonte
1

Existem dois problemas com o seu código

  1. Para encontrar um elemento por ID, você deve prefixá-lo com um "#"
  2. Você está tentando passar um número para a função localizar quando uma string é necessária (passar "#" + 5 resolveria isso, pois converteria o 5 em um "5" primeiro)
Bert Lamb
fonte
0

Não sei muito sobre jQuery, mas tente isto:

row_id = "#5";
row = $("body").find(row_id);

Edit: Claro, se a variável é um número, você tem que adicionar "#"à frente:

row_id = 5
row = $("body").find("#"+row_id);
Zifre
fonte