简单js——点击按钮弹窗（文本框的内容）

最新推荐文章于 2024-08-29 10:04:34 发布

原创最新推荐文章于 2024-08-29 10:04:34 发布 · 1.6w 阅读

38 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

JS 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一个简单的HTML页面，其中包含一个文本输入框和一个按钮。通过JavaScript函数clickMe(), 当按钮被点击时，可以获取到文本框内的值，并在浏览器的控制台及弹窗中显示该值。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			function clickMe() {
				//得到input标签对象
				var input = document.getElementById("inputId");
				console.log(input.id) //在控制台打印出inputId
				console.log(input.type) //text
				console.log(input.value) //hello
				alert(input.value);
			}
		</script>
	</head>
	<body>
		<input type="text" id="inputId" value="hello" />
		<button  onclick="clickMe()">点我</button>
	</body>
</html>

效果图：

默认值为hello，点击按钮则弹窗和控制台效果如下：