Obter tipo de elemento com jQuery

308

É possível, usando o jQuery, descobrir o tipo de um elemento com o jQuery? Por exemplo, o elemento é uma div, span, select ou input?

Por exemplo, se estou tentando carregar valores em uma lista suspensa com o jQuery, mas o mesmo script pode gerar código em um conjunto de botões de opção, posso criar algo como:

$('.trigger').live('click', function () {
   var elementType = $(this).prev().attr(WHAT IS IT);
});

Dada uma lista suspensa com um botão próximo a ela com a classe trigger , minha elementTypevariável deve retornar selectapós o botão ser pressionado.

jquery element

— Jamie Hartnoll
fonte

Você pode reformular? o que você quer dizer com tipo de elemento?

— Abdul Munim

possível duplicata de Como posso determinar o tipo de elemento correspondente em jQuery?

— Nathaniel Ford

possível duplicata de encontrar o tipo de um elemento usando jQuery

— Felix Kling

558

Obtendo o elemento, digite a maneira jQuery:

var elementType = $(this).prev().prop('nodeName');

fazendo o mesmo sem jQuery

var elementType = this.previousSibling.nodeName;

Verificando o tipo de elemento específico:

var is_element_input = $(this).prev().is("input"); //true or false

— adeneo
fonte

16

Lembre-se de que a função .prop () foi adicionada apenas no jQuery 1.6 - você pode precisar atualizar a versão que está usando!

— xgretsch

Não funcionou com o jQuery 1.3.2 antigo, por isso foi atualizado para o mais recente e funcionou bem.

— Damodar Bashyal

2

Isso pode ser melhorado alternando 'tagName' para 'nodeName' conforme mencionado aqui .

— Kyle Stoflet

1

@KyleStoflet - parece que você está certo, nodeNamesuporta mais tipos de elementos e o suporte ao IE5.5 não deve ser mais um problema, por isso não vejo problemas em mudar tagNamepara nodeNamea resposta acima. Ambos funcionarão bem para elementos, e o último funcionará também em nós de texto, atributos etc.

— 31415 adeneo

3

Funciona, mas fiquei um pouco confuso com o prev (), que é específico para o código de exemplo em questão. Basicamente,$(this).is("input");

— Fanky

56

Também você pode usar:

$("#elementId").get(0).tagName

— Todos
fonte

26

você deve usar tagNamepropriedade e attr('type')para entradas

— Distdev
fonte

Um exemplo tornaria esse comentário mais forte.

— perfil completo de Justapigeon

16

Como o Distdev mencionou, você ainda precisa diferenciar o tipo de entrada. Isto é,

$(this).prev().prop('tagName');

dirá a você input, mas isso não diferencia a caixa de seleção / texto / rádio. Se for uma entrada, você poderá usar

$('#elementId').attr('type');

para informar a caixa de seleção / texto / rádio, para que você saiba que tipo de controle é esse.

— James Toomey
fonte

9

você pode usar .is():

  $( "ul" ).click(function( event ) {
      var target = $( event.target );
      if ( target.is( "li" ) ) {
         target.css( "background-color", "red" );
      }
  });

ver fonte

— Mohammed Sufian
fonte

3

use get (0) .tagName. Veja este link

— Amar
fonte

3

Use Nodename sobre tagName:

nodeName contém todas as funcionalidades de tagName, além de mais algumas. Portanto, nodeName é sempre a melhor escolha.

veja DOM Core

— Mike Rifgin
fonte