テキストフィールド/テキストエリアへのアクセス

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Sample</title>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript"><!--
function displayData1()
{
var usrname = document.getElementById("userName").value;
var age = document.getElementById("userAge").value;
$("result").innerHTML = "(1) 名前："+usrname+"<br>年齢"+age;
}
function displayData2()
{
var usrname = document.ajaxForm.uName.value;
var age = document.ajaxForm.uAge.value;
$("result").innerHTML = "(2) 名前："+usrname+"<br>年齢"+age;
}
function displayData3()
{
var usrname = $F("userName");
var age = $F("userAge");
$("result").innerHTML = "(3) 名前："+usrname+"<br>年齢："+age;
}
// --></script>
</head>
<body>
<h1>テキストフィールドへのアクセス</h1>
<form name="ajaxForm" id="aForm">
名前：<input type="text" value="Kojima" id="userName" name="uName"><br>
年齢：<input type="text" value="30" id="userAge" name="uAge"><br>
<input type="button" value="id属性を参照" onClick="displayData1()"><br>
<input type="button" value="name属性を参照" onClick="displayData2()"><br>
<input type="button" value="prototype.jsを使って参照" onClick="displayData3()"><br>
</form>
<div id="result"></div>
</body>
</html>
・サンプルを実行する
Ajax逆引きクイックリファレンス　説明などは本書を参考にしてください。