用html写一个可以检测多少汉字的dome需要CSS样式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>汉字字符检测</title>
<style>
body {
font-size: 20px;
font-family: 'Microsoft Yahei', sans-serif;
}
input {
width: 200px;
height: 30px;
font-size: 20px;
padding-left: 10px;
box-sizing: border-box;
border: 1px solid #ccc;
}
button {
width: 80px;
height: 35px;
font-size: 20px;
background-color: #007bff;
color: #fff;
border: none;
cursor: pointer;
}
.result {
margin-top: 20px;
font-size: 24px;
}
</style>
</head>
<body>
<h1>汉字字符检测</h1>
<form>
<label>请输入汉字字符串：</label>
<input type="text" id="inputStr">
<button type="button" onclick="countChars()">检测</button>
</form>
<div class="result" id="result"></div>
<script>
function countChars() {
var str = document.getElementById("inputStr").value;
var count = 0;
for (var i = 0; i < str.length; i++) {
if (str.charCodeAt(i) >= 19968 && str.charCodeAt(i) <= 40869) {
count++;
}
}
document.getElementById("result").innerHTML = "共输入了" + count + "个汉字";
}
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/Ni8 著作权归作者所有。请勿转载和采集!