Capítulo 13

Propriedades do objeto form - Exemplo 4

JavaScript

<script type="text/javascript">
window.onload = function () {
var el, msg, mensagem, elBotao;
	el = document.getElementsByTagName("form").form1;
	msg = document.getElementById("msg");
	elBotao = document.getElementById("btn");	
	mensagem = "<h3>Acesso aos controles do formulário do documento</h3>";
	mensagem += "<ul>";
	mensagem += "<li>Qde. controles= " + el.elements.length + "</li>";
	for ( var i=0; i<el.elements.length; i++) {
		mensagem += "<li>" + (i + 1) +"<sup>o.</sup> controle= " + el.elements[i].title + "</li>";
	}
	mensagem += "<li>Option 2= " + el.elements[2].options[1].innerHTML + "</li>";
	mensagem += "</ul>";	
	elBotao.onclick	= function() {
		msg.innerHTML = mensagem;
	}
}
<script>

HTML

...
<form name="form1" action="" method="post" >
<fieldset title="Fieldset">
<legend>Formulário 1</legend>
<label for="nome">Nome:</label><br />
<input type="text" name="nome" id="nome" title="Input nome" /><br /><br />
<label for="cidade">Cidade:</label><br />
<select name="cidade" id="cidade" title="Select cidade">
<option value="">Escolha uma cidade</option>
<option value="rio">Rio de Janeiro</option>
<option value="sp">São Paulo</option>
</select><br /><br />
<label for="senha">Senha:</label><br /> 
<input type="password"  name="senha" id="senha" title="Input senha" /><br /><br />
<input type="submit" value="Enviar" title="Input submit" />
</fieldset>
</form>

<div id="msg"></div>
<button type="button" id="btn">Rodar Script</button>
...
Formulário 1