按钮单击事件时旋转文本

按钮单击事件时旋转文本是一个前端开发的需求，可以使用JavaScript和CSS来实现。下面是一个简单的示例代码：

HTML代码：

<!DOCTYPE html>
<html>
<head><title>按钮单击事件时旋转文本</title><style>
		.rotate {
			transform: rotate(90deg);
			transition: transform 0.5s;
		}
	</style>
</head>
<body><button id="rotate-btn">旋转文本</button>
	<p id="text">Hello World!</p><script>
		var btn = document.getElementById("rotate-btn");
		var text = document.getElementById("text");
		btn.addEventListener("click", function() {
			text.classList.toggle("rotate");
		});
	</script>
</body>
</html>

在这个示例中，我们使用了CSS的transform属性来旋转文本，并使用transition属性来实现旋转动画。在JavaScript中，我们为按钮添加了一个单击事件监听器，当单击按钮时，会为文本元素添加或移除rotate类，从而实现旋转文本的效果。

这个示例可以直接复制到一个HTML文件中，然后在浏览器中打开，即可看到旋转文本的效果。