<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--
执行的時候是自上而下,当放在这里的时候就...
如果希望在head标签里面执行,那么需要添加一个入口函数
-->
<script type="text/javascript">
//表示窗口的意思,onload表示加载js里面的函数,原因是js是解释型语言,程序从上到下的执行,执行
//到document.getElementById("txt")的时候程序不认识txt属性,所以加window.onload之后,
//程序执行到window.onload的时候会停住,跳过后面的function(){}部分,直接往下走,
//当需要执行function(){}部分的时候才会去加载函数.也就是说这样就把js部分的代码和html代码分离开了,
//相互独立.互不影响
window.onload = function(){
//获取文本框
var oTxt = document.getElementById("txt")
//获取按钮
var oBtn = document.getElementById("btn")
oBtn.onclick = function(){
//value获取input文本框的值
var val = oTxt.value
alert(val)
}
}
</script>
</head>
<body>
<input type="text" id="txt" value="哈哈" />
<input type="button" id="btn" value="点击我" />
</body>
<!--<script type="text/javascript">
///获取文本框
var oTxt = document.getElementById("txt")
//获取按钮
var oBtn = document.getElementById("btn")
// 设置按钮的点击事件,当点击按钮去的时候就会调用函数里面的方法
oBtn.onclick = function(){
var value = oTxt.value
alert(value)
}
</script>-->
</html>
<!--
获取标签里面的值:value
-->
演示效果:
原文地址：https://www.cnblogs.com/huaibin/p/12589946.html
时间： 2024-07-30 00:03:44