O método getElementsByName() do objeto document é usado quando precisamos obter uma lista (coleção NodeList ou matriz) de elementos HTML que possuem o mesmo valor para sua propriedade name. Veja:
<html>
<head>
<title>Estudos JavaScript</title>
<script type="text/javascript">
function localizarElementos(){
// vamos obter os elementos com o valor "linguagens"
// para sua propriedade name
var elems = document.getElementsByName("linguagens");
// encontramos algum elemento
if(elems.length > 0){
// vamos percorrer os elementos encontrados
for(var i = 0; i < elems.length; i++){
// vamos verificar se este radio button está selecionado
if(elems[i].checked){
window.alert("O " + (i + 1) +
"º radio button ESTÁ selecionado");
}
else{
window.alert("O " + (i + 1) +
"º radio button NÃO está selecionado");
}
}
}
else{
window.alert("Nenhum elemento localizado.");
}
}
</script>
</head>
<body>
<form name="form1">
<input name="linguagens" type="radio" value="1"
checked="checked" /> Java
<input name="linguagens" type="radio" value="1" /> Delphi
<input name="linguagens" type="radio" value="1" /> C#<br />
<input type="button" name="btn" onclick="localizarElementos()"
value="Verificar Radio Buttons" />
</form>
</body>
</html>
Neste exemplo nós temos três botões do tipo radio button, todos com o mesmo valor para seu atributo name. Quando clicamos no botão, este chama uma função personalizada que usa o método getElementsByName() do objeto document para obter os elementos como uma matriz. Note que é sempre uma boa idéia testar o tamanho da matriz retornada antes de efetuar qualquer procedimento.
O método getElementsByName() funciona de forma diferente dependendo do browser:
a) No Internet Explorer e Opera, o método pesquisa e retorna os elementos que possuem correspondência nos atributos id e name.
b) No Firefox, Google Chrome e Safari, somente elementos com correspondência no atributo name são retornados.
c) No Firefox, Opera, Google Chrome e Safari, o método é case-sensitive (sensível a maiúsculas e minúsculas) em relação ao valor da propriedade name (e id no Opera).
d) No Internet Explorer (IE), o método não é case-sensitive (sensível a maiúsculas e minúsculas) em relação ao valor da propriedade name e id.
Nenhum comentário:
Postar um comentário