页面加载完成和执行点击事件

最新推荐文章于 2024-09-11 11:06:34 发布

宇宙超级美少女

最新推荐文章于 2024-09-11 11:06:34 发布

阅读量9.7k

点赞数

分类专栏：拓展

本文链接：https://blog.csdn.net/kobe081959/article/details/79072167

版权

拓展专栏收录该内容

1 篇文章 0 订阅

订阅专栏

页面加载完成和执行点击事件

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<input type="text" id="txt1"/><br/>+
	<input type="text" id="txt2"/><br/>
	<input type="button" id="btn" value="="/>
</body>
<!-- 因为代码的执行是从上到下依次执行，所以，把js代码块单独写在所有的body后面 -->
<script type="text/javascript">
// 页面全部加载完成以后执行以下的js代码区
window.onload = function(){
	// 当执行点击事件的时候把或取到的两个数相加
	// 执行点击事件
	document.getElementById("btn").onclick = function(){
	    // 通过id先获取两个文本框的value值,并将文本框的值转化为数字型
	    var num1 = Number(document.getElementById("txt1").value);
	    var num2 = Number(document.getElementById("txt2").value);
	    // 将相加的结果放在控制台
		console.log(num1+num2);
	}
}
// 注意：获取文本框内容的时候必须是执行点击事件的时候再获取文本框的值，否则在页面加载完成就获取文本框的值，拿到的就是一个空值
</script>
</html>