Quando usar class ou id?
Fala pessoal, beleza?
Queria saber uma coisa, quando devo usar class ou id no html para depois usar esse identificador no css e no javascript.
Isso tem um padrão a ser seguido ou é uma preferência de quem está construindo o html?
Queria saber uma coisa, quando devo usar class ou id no html para depois usar esse identificador no css e no javascript.
Isso tem um padrão a ser seguido ou é uma preferência de quem está construindo o html?
Alessandro Gomes
Curtidas 0
Melhor post
Raylan Zibel
10/04/2017
Voce deve usar ambos.
O id/name são muito importantes pra troca de dados ou localizar itens, pois são identificadores unicos. (forms/validações)
Ja class é mais amplo. Pode se referir a uma coleção de itens ou um tipo de item. (bootstrap, jquery ui)
O id/name são muito importantes pra troca de dados ou localizar itens, pois são identificadores unicos. (forms/validações)
Ja class é mais amplo. Pode se referir a uma coleção de itens ou um tipo de item. (bootstrap, jquery ui)
GOSTEI 6
Mais Respostas
Yuri Abel
10/04/2017
Olá irei dar minha opinião,
eu utilizo os dois, porem direciono o class para trabalhar com css, e o id para trabalho no javascript.
mas isso é minha maneira de programar, se procurar procurar provavelmente irá achar um explicação técnica elaborada,
espero ter ajudado!!
eu utilizo os dois, porem direciono o class para trabalhar com css, e o id para trabalho no javascript.
mas isso é minha maneira de programar, se procurar procurar provavelmente irá achar um explicação técnica elaborada,
espero ter ajudado!!
GOSTEI 4
Alessandro Gomes
10/04/2017
Obrigado pelo esclarecimento pessoal!
GOSTEI 0
Larissa Aguiar
10/04/2017
Alessandro, só tem que tomar cuidado quando for usar o id pois ele é um identificador único. Pode-se ter mais de um elemento com a mesma classe numa página. Já com o id isso não pode acontecer.
GOSTEI 0
Alessandro Gomes
10/04/2017
Sim Larissa, disso eu já sabia. A minha dúvida era relativa ao uso mesmo.
Por exemplo. O id seria melhor para quando se quisesse usar a manipulação com jquery, class seria para estilização, etc.
Sua resposta e dos demais colegas me ajudaram!
Obrigado!
Por exemplo. O id seria melhor para quando se quisesse usar a manipulação com jquery, class seria para estilização, etc.
Sua resposta e dos demais colegas me ajudaram!
Obrigado!
GOSTEI 0
Raphael Alves
10/04/2017
Fala galera,
A velocidade de busca do browser em relação ao ID e a Class é praticamente a mesma e não faz diferença no carregamento da página, porém com a class você tem a vantagem de poder repetir, por isso eu prefiro sempre usar classes e deixa os ID's apenas para JS e âncoras. Vou tentar acrescentar uma coisa nova na explicação usando o exemplo abaixo:
Neste casso, se fizermos um seletor para <a class="social-link">, além do fato já conhecido da possibilidade de repetição de código, o navegador acha o nosso seletor chave de maneira muito mais lenta se for escrito dessa forma:
Pois o navegador analisaria TODAS as tags <a> do seu código e depois pegaria somente as que fazem match com o ID #container
Seria muito mais rápido para o navegador escrever dessa forma:
Dessa forma ele vai direto na tag <a> que tem a class .social-link, melhorando a perfomance da sua página. Esse é um bo exemplo de quando usar class.
Abraaço.
A velocidade de busca do browser em relação ao ID e a Class é praticamente a mesma e não faz diferença no carregamento da página, porém com a class você tem a vantagem de poder repetir, por isso eu prefiro sempre usar classes e deixa os ID's apenas para JS e âncoras. Vou tentar acrescentar uma coisa nova na explicação usando o exemplo abaixo:
<div id="container"> <a class="social-link">link 1</a> <a class="social-link">link 2</a> <a class="social-link">link 3</a> </div>
Neste casso, se fizermos um seletor para <a class="social-link">, além do fato já conhecido da possibilidade de repetição de código, o navegador acha o nosso seletor chave de maneira muito mais lenta se for escrito dessa forma:
#container a { display: block
Pois o navegador analisaria TODAS as tags <a> do seu código e depois pegaria somente as que fazem match com o ID #container
Seria muito mais rápido para o navegador escrever dessa forma:
.social-link { display: block
Dessa forma ele vai direto na tag <a> que tem a class .social-link, melhorando a perfomance da sua página. Esse é um bo exemplo de quando usar class.
Abraaço.
GOSTEI 2
Tiago Dias
10/04/2017
Putz,
confesso que utilizava mais de um id no meu HTML.. mas em tese qual é o problema? Gera algum tipo de punição para o site?
confesso que utilizava mais de um id no meu HTML.. mas em tese qual é o problema? Gera algum tipo de punição para o site?
GOSTEI 0
Raphael Alves
10/04/2017
Fala Tiago,
Cara, eu não sei se você recebe alguma punição, mas isso pode prejudicar sua página com os mecanismos de busca, ele funciona, mas não é um código válido. De cara o problema que eu sei que irá ocorrer é: caso você use JavaScript para selecionar o id, ele vai pegar apenas o primeiro id e irá ignorar os outros.
Abraaço.
Cara, eu não sei se você recebe alguma punição, mas isso pode prejudicar sua página com os mecanismos de busca, ele funciona, mas não é um código válido. De cara o problema que eu sei que irá ocorrer é: caso você use JavaScript para selecionar o id, ele vai pegar apenas o primeiro id e irá ignorar os outros.
Abraaço.
GOSTEI 0