JavaScript 点击事件

最新推荐文章于 2024-06-04 10:37:05 发布

原创最新推荐文章于 2024-06-04 10:37:05 发布 · 364 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

41 篇文章

订阅专栏

本文介绍了一个简单的HTML页面，该页面使用JavaScript为不同的元素添加了单击和双击事件处理程序。通过这些事件，元素的背景颜色会在交互时发生变化。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>点击事件</title>
	</head>
	<body>
		<div id="dan" style="width:300px;height:300px;border:2px solid gray;">点我试试</div>
		<div class="shuang" style="width:300px;height:300px;border:2px solid gray;">点我两下试试</div>
	</body>
	<script>
		//找到对象
		var dan = document.getElementById('dan');
		//添加事件
		//onclick别再写错了  写错了耽误好久= =|||
		dan.onclick = function(){
			//修改属性
			this.style.background = 'gray';
		};
		
		//找到对象
		var shuang = document.getElementsByClassName('shuang');
		//添加事件
		shuang[0].ondblclick = function(){
			this.style.background = 'pink';
		};
	</script>
</html>