JavaScript第九章 DOM编程之获取文本框的value
程序员文章站
2022-06-15 13:33:28
...
JavaScript自我学习路线
DOM编程之获取文本框的value
- 获取文本框的value
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>获取文本的value</title>
<script type="text/javascript">
window.onload = function() {
var btnElt = document.getElementById("btn");
btnElt.onclick = function() {
// 获取username节点
var usernameElt = document.getElementById("username");
var username = usernameElt.value;
alert(username);
/*
简写
alert(document.getElementById("username").value);
*/
/*
修改
document.getElementById("username").value = "zhangsan";
*/
}
}
</script>
</head>
<body>
<input type="text" id="username" />
<input type="button" value="获取文本的value" id="btn" />
</body>
</html>
- 将第一个文本框中的value赋值到第二个文本框上
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>将第一个文本框中的value赋值到第二个文本框上</title>
<script type="text/javascript">
window.onload = function() {
document.getElementById("setBtn").onclick = function() {
document.getElementById("uname2").value = document.getElementById("uname1").value;
}
}
</script>
</head>
<body>
<input type="text" id="uname1" />
<br>
<input type="text" id="uname2" />
<br>
<input type="button" value="将第一个文本框中的value赋值到第二个文本框上" id="setBtn" />
</body>
</html>