把alert写成输出显示 写完整版!DOCTYPE htmlhtmlhead title汉字检测器title meta charset=UTF-8 style 居中显示 body display flex; flex-direction column; align-items center; justify-content center; height 100vh;

<!DOCTYPE html>
<html>
<head>
	<title>汉字检测器</title>
	<meta charset="UTF-8">
	<style>
		/* 居中显示 */
		body {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			height: 100vh;
			margin: 0;
			background-color: #f7f7f7;
		}
<pre><code>	h1 {
		font-size: 36px;
		font-weight: bold;
		margin-bottom: 20px;
	}

	.input-box {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 500px;
		height: 300px;
		padding: 20px;
		background-color: #fff;
		border-radius: 10px;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	}

	.textarea {
		width: 100%;
		height: 200px;
		padding: 10px;
		font-size: 18px;
		border: 1px solid #ccc;
		border-radius: 5px;
		resize: none;
		margin-bottom: 20px;
	}

	.btn-wrap {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.btn {
		padding: 10px 20px;
		border: none;
		border-radius: 5px;
		background-color: #007bff;
		color: #fff;
		font-size: 18px;
		cursor: pointer;
		margin: 0 10px;
	}

	.clear-btn {
		background-color: #dc3545;
	}
&lt;/style&gt;
</code></pre>
</head>
<body>
	<h1>汉字检测器</h1>
	<div class="input-box">
		<textarea class="textarea" placeholder="请输入需要检测的汉字"></textarea>
		<div class="btn-wrap">
			<button class="btn check-btn">检测</button>
			<button class="btn clear-btn">清空</button>
		</div>
	</div>
	<script>
		const textarea = document.querySelector('.textarea');
		const checkBtn = document.querySelector('.check-btn');
		const clearBtn = document.querySelector('.clear-btn');
<pre><code>	checkBtn.addEventListener('click', () =&gt; {
		const content = textarea.value.trim();
		const reg = /[\u4e00-\u9fa5]/g;
		const result = (content.match(reg) || []).length;
		const output = document.createElement('div');
		output.innerText = `输入的文本中共包含 ${result} 个汉字`;
		document.body.appendChild(output);
	});

	clearBtn.addEventListener('click', () =&gt; {
		textarea.value = '';
		const output = document.querySelector('div');
		if (output) {
			document.body.removeChild(output);
		}
	});
&lt;/script&gt;
</code></pre>
</body>
</html>

把alert写成输出显示 写完整版!DOCTYPE htmlhtmlhead title汉字检测器title meta charset=UTF-8 style 居中显示 body display flex; flex-direction column; align-items center; justify-content center; height 100vh;

把alert写成输出显示写完整版!DOCTYPE htmlhtmlhead title汉字检测器title meta charset=UTF-8 style 居中显示 body display flex; flex-direction column; align-items center; justify-content center; height 100vh;