以下是一个简单的示例,当您单击页面时,页面的背景颜色会更改,并在页面上添加一条注释:

HTML代码:

<!DOCTYPE html>
<html>
<head>
	<title>点击换颜色加注</title>
	<style>
		body {
			background-color: #fff;
		}
	</style>
</head>
<body>
	<h1>点击换颜色加注</h1>
	<p>单击页面以更改背景颜色。</p>
	<script src="app.js"></script>
</body>
</html>

JavaScript代码:

// 获取body元素
var body = document.querySelector('body');

// 在页面上添加一条注释
var note = document.createElement('p');
note.textContent = '颜色已更改!';
note.style.display = 'none';
body.appendChild(note);

// 单击事件监听器
body.addEventListener('click', function() {
	// 更改背景颜色
	body.style.backgroundColor = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
	
	// 显示注释
	note.style.display = 'block';
	
	// 2秒后隐藏注释
	setTimeout(function() {
		note.style.display = 'none';
	}, 2000);
});

此代码将在单击页面时更改背景颜色,并在屏幕上添加一条注释,指示颜色已更改。注释将在2秒后自动消失。

js页面点击换颜色加注

原文地址: https://www.cveoy.top/t/topic/bkMX 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录