GetElementByName: mudanças entre as edições
De Wiki Cursos IFPR Foz
Ir para navegaçãoIr para pesquisar
(Criou página com ' == Usando getElementByName == ''Muita gente costuma usar o document.getElementById, mas, existe também uma forma de obter ou mudar valores de um element pelo name dele. V...') |
|||
(4 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
Linha 2: | Linha 2: | ||
== Usando getElementByName == | == Usando getElementByName == | ||
''Muita | ''Muita genteee costuma usar o document.getElementById, mas, existe também uma formaaa de obter ou mudaaar vaaalores de um element pelo naame dele. | ||
Veja esse exemplo | Veja esse exemplooo simpless:'' | ||
<pre> | |||
<script type="text/javascript"> | |||
window.onload = function mostra() { | |||
document.getElementsByName('elemento')[0].value="novo valor"; | |||
} | |||
</script> | |||
<input type="button" name="elemento" value="valor atual"> | |||
</pre> | |||
''O que é feito, é que ele procura no documento os elementos com nome "elemento" e pega o primeiro que encontrar, no caso, o único do formulário. Note que o primeiro elemento começa do 0, e não do 1.'' | |||
''Note no próximo exemplo, como é possível saber quantos elementos no documento tem o mesmo nome'' | |||
<pre> | |||
<script type="text/javascript"> | |||
window.onload = function mostra() { | |||
alert(document.getElementsByName('elemento').length); | |||
} | |||
</script> | |||
<input type="checkbox" name="elemento" value="valor 1"> | |||
<input type="checkbox" name="elemento" value="valor 2"> | |||
</pre> | |||
''Agora vou mostrar um exemploooo básicoooo usando o getElementsByName validando inputs radio.'' | |||
<pre> | |||
<script type="text/javascript"> | |||
function mostra() { | |||
var elemento = document.getElementsByName('elemento'); | |||
if(elemento[0].checked==false && elemento[1].checked==false) { | |||
alert('preencha um dos input.'); | |||
return false; | |||
} | |||
} | |||
</script> | |||
<form action="" method="POST" onsubmit="return mostra()"> | |||
<input type="radio" name="elemento" value="valor1"> | |||
<input type="radio" name="elemento" value="valor2"> | |||
<input type="submit"> | |||
</form></pre> |
Edição atual tal como às 10h21min de 7 de novembro de 2013
Usando getElementByName
Muita genteee costuma usar o document.getElementById, mas, existe também uma formaaa de obter ou mudaaar vaaalores de um element pelo naame dele.
Veja esse exemplooo simpless:
<script type="text/javascript"> window.onload = function mostra() { document.getElementsByName('elemento')[0].value="novo valor"; } </script> <input type="button" name="elemento" value="valor atual">
O que é feito, é que ele procura no documento os elementos com nome "elemento" e pega o primeiro que encontrar, no caso, o único do formulário. Note que o primeiro elemento começa do 0, e não do 1.
Note no próximo exemplo, como é possível saber quantos elementos no documento tem o mesmo nome
<script type="text/javascript"> window.onload = function mostra() { alert(document.getElementsByName('elemento').length); } </script> <input type="checkbox" name="elemento" value="valor 1"> <input type="checkbox" name="elemento" value="valor 2">
Agora vou mostrar um exemploooo básicoooo usando o getElementsByName validando inputs radio.
<script type="text/javascript"> function mostra() { var elemento = document.getElementsByName('elemento'); if(elemento[0].checked==false && elemento[1].checked==false) { alert('preencha um dos input.'); return false; } } </script> <form action="" method="POST" onsubmit="return mostra()"> <input type="radio" name="elemento" value="valor1"> <input type="radio" name="elemento" value="valor2"> <input type="submit"> </form>