Blog do Jerônimo

Dois objetos são extremamente importantes no JavaScript: window e document.
O objeto window premite acessar propriedades e métodos relativos à janela toda do navegador. Por exemplo, o método window.resize redimensiona a janela do navegador, se as configurações de segurança permitirem isso.
Já o objeto document é o mais utilizado. Ele corresponde ao corpo do documento HTML em questão. Cada div, tabela, célula de tabela, campo de texto, checkbox, enfim, tudo que forma seu documento é acessível pelo objeto document.

Para pegar um elemento específico de sua página, basta chamar o método getElementById do objeto document. Para isso, é necessário que o elemento que queremos pegar tenha um atributo id definido. Lembre-se que não pode haver mais de um elemento com o mesmo id na mesma página. Há alguns problemas com versões mais antigas do IE, compreenda todo o problema clicando aqui.

Então, para pegarmos, por exemplo, um campo de texto (input type=text) cujo id seja “meu_texto”, basta fazer no JavaScript:
document.getElementById(”meu_texto”)
A partie disso você pode acessar propriedades desse elemento. No caso do nosso exemplo:
document.getElementById(”meu_texto”).value - Acessa a propriedade value do elemento, tanto em leitura como escrita. Para escrita, basta colocar a expressão citada, o sinal de igual, e o novo valor entre aspas. Assim:
document.getElementById(”meu_texto”).value = “Um texto qualquer”
Para acessar o atributo disabled, podemos fazer:
document.getElementById(”meu_texto”).disabled
E assim vai.

Para uma referência completa sobre quais atributos podes acessar, quais permitem leitura e escrita, quais são apenas escrita, etc, recomendo consultar o livro JavaScript - The Definitive Guide, de David Flanagan, 5ª Edição (O’Reilly). Caso não possa ter acesso ao livro, procure referências diversas no seu buscador favorito; mas recomendo dar uma olhada na W3Schools.

Encerro aqui a parte 2 do tutorial. Quando me der na telha escrevo uma parte 3.

Sem dúvida, uma das funções mais usadas do JavaScript (se não for A mais usada) é o document.getElementById(). O que nem todos sabem é de um pequeno problema sobre a implementação desta função no Internet Explorer.

Bem, segundo o que o próprio nome da função diz, ela é uma função para “pegar um elemento pelo id”; contudo, no IE, esta função também pega um elemento pelo name.Veja o exemplo.

Imagine o seguinte código:
<input name="teste" type="text" value="oops">
<script type="text/javascript">
var a = document.getElementById('teste');
try{
alert(a.value);
}
catch(e){
alert('"teste" não existe!');
}
</script>

O que se espera é que ‘”teste” não existe’ seja alertado, pois não há elemento com id igual a “teste”, logo “a” seria nulo. Isso ocorre no Firefox, por exemplo. Já no IE o valor “oops” é alertado, pois ele pega o elemento pelo name, e não pelo id.

Duvida? Faça o teste com o código acima.
Podemos dizer então que o IE está errado em sua implementação? Não necessariamente.

Do ponto de vista do nome da função, “getElementById”, os elementos deveriam ser pegos por e somente por id, e não por name. Contudo, o W3C define que id e name compartilham do mesmo namespace; segundo o consórcio, quando id e name são usados simultaneamente em uma mesma tag eles PRECISAM ter o mesmo valor. Além disso, é proibido usar um id igual a um name para elementos diferentes. Assim, a Microsoft não pode ser acusada de ter implementado incorretamente a função pois, no exemplo acima, se existisse algum elemento com id igual a “teste”, seria o mesmo input text, visto que o seu name já é “teste”, logo o id “teste” só poderia ser aplicado aquele elemento, semanticamente falando.

Mas ainda tem a questão de que o nome da função informa que o elemento será pego pelo id, e não pelo name… Afinal, quem tem a razão?

Minha resposta pessoal é: não sei. Mas tenho uma opinião pessoal.

Eu acho que se o nome da função informa que o elemento será pego por id, ele deve ser pego somente por este atributo, e não por name (ao contrário do que ocorre no IE). Pois, semanticamente falando, o atributo id pode existir ou não, independentemente da existência do atributo name, e vice-versa! O fato é que se há um atributo name definido e o atributo id não foi, então NÃO HÁ um elemento com o atributo id igual ao valor passado por parâmetro, logo, não se pode pegar o elemento por id.

Isso é o que eu acho. Mas quem deve decidir qual das implementações é correta é o W3C.

E você? Tem opinião formada sobre isso?

Fonte de inspiração: Quirksmode