Caracteres Permitidos no ID do DOM: Hífens, Underlines e Mais
Resposta Rápida
Para identificadores do DOM em HTML, as seguintes regras são válidas: eles devem começar com letras (A-Z/a-z) e podem incluir letras, dígitos (0-9), hífens (-), underlines (_), dois pontos (:) e pontos (.):
<div id="id-123"></div> <!-- Identificador válido, sem problemas! 👍 -->Identificadores não podem começar com dígitos ou usar caracteres especiais:
<div id="123abc"></div> <!-- Este uso é incorreto 😅 -->É importante garantir a unicidade dos identificadores, já que eles não devem se repetir dentro de um único documento.
Regras de ID em HTML e XHTML
As regras para caracteres permitidos no atributo ID em HTML e XHTML são diferentes. HTML é bastante permissivo nesse aspecto, enquanto XHTML adere estritamente às regras do XML.
Do Simples ao Complexo: Caracteres e Cadeias
UTF-16: Representação de DOMString
Em JavaScript, os identificadores são designados como DOMString com codificação UTF-16, permitindo o uso de quase qualquer caractere UTF-16. No entanto, é essencial seguir os padrões do HTML para evitar erros.
Caracteres Especiais: Usar ou Não?
Embora caracteres especiais, além dos padrões, assim como espaços ou sinais de pontuação (exceto hífens e underlines), possam ter uma qualidade visual atraente, é aconselhável não usá-los.
Interação com Dois Pontos: Usando Namespaces de XML
Em XHTML, identificadores que contêm dois pontos são significativos devido ao seu papel em namespaces XML. Mais atenção é dada à adesão às regras em XHTML do que em HTML.
Simplificando Sua Vida
Peculiaridades Históricas do HTML
Certos caracteres podem causar falhas em sistemas que suportam versões desatualizadas do HTML. Para garantir um desempenho estável, é imperativo seguir as especificações do W3C.
A Importância da Acessibilidade
Seus identificadores podem interagir com leitores de tela, ferramentas de acessibilidade e funções de Landmark ARIA. É vital torná-los o mais claros e informativos possível.
Visualização — Designações Claras e Compreensíveis
Imagine que os caracteres estão na fila pelo direito de fazer parte da sua "Cidade dos Identificadores":
Bem-vindo à "Cidade dos Identificadores"! Seu endereço corresponde ao seu símbolo de ID. 🏠[🏠1a] [🏠-2b] [🏠_3c] ... [🏠N]
| | | |
Permitido! Permitido! Permitido! ... Permitido!Endereços baseados em caracteres inválidos não serão aceitos e não poderão fazer parte da "Cidade dos Identificadores":
Na nossa "Cidade dos Identificadores", todo endereço começa com uma letra ou underscore, seguido por dígitos, hífens, letras ou underscores.
**Exemplo de ID de Casa: [🏠_minhaCasa123]** <!-- À venda: uma aconchegante casa de três quartos! -->Se o seu identificador consistir apenas em caracteres válidos, seja bem-vindo à "Cidade dos Identificadores!"
Recursos Úteis
- Estrutura Global de um Documento HTML - Especificação W3C, incluindo atributo ID.
- Propriedade id de Elemento - Web API | MDN - Exemplos detalhados e descrições do uso do atributo id.
- Padrão HTML - Especificação atual do WhatWG para o atributo ID.
- Diferença Entre ID e Classe | CSS-Tricks - Uma análise de ID versus classes e melhores práticas para seu uso.
- Atributo ID Global em HTML - Um guia para o uso do atributo id e exemplos.
- Quais Valores o Atributo id Pode Ter em HTML? - Stack Overflow - Discussão da comunidade sobre o atributo id em HTML.
- Representação de Caractere em HTML - Visão geral da representação de caracteres no HTML pelo W3C.