<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
<link rel="stylesheet" href="css.css">
<script src="js.js"></script>
</head>
<body>
<div>
<h2>寻找字符串中出现字符最多的次数，出现次数最多的字符，出现次数最多的字符的索引</h2>
<input type="text" placeholder="请输入字符串">
<button>计算</button>
<br> 出现字符最多的次数：
<input type="text" />
<br> 出现次数最多的字符：
<input type="text" />
<br> 出现次数最多的字符的索引：
<input type="text" />
</div>
</body>
</html>
css.css
div {
800px;
height: 200px;
background: #f1f1f1;
margin: 0 auto;
text-align: center;
line-height: 20px;
border: 1px solid #ccc;
border-radius: 10px;
}
h2 {
font-size: 20px;
100%;
}
button {
cursor: pointer;
background: #eee;
border: 1px solid #ddd;
}
input {
165px;
height: 25px;
border: 1px solid #ddd;
}
js.js
window.onload = function() {
var oBtn = document.getElementsByTagName("button");
var oIpt = document.getElementsByTagName("input");
oBtn[0].onclick = function() {
var str = oIpt[0].value;
var objChar = {};
for (var i = 0; i < str.length; i++) {
var char = str.charAt(i);
if (objChar[char]) {
objChar[char] += 1;
} else {
objChar[char] = 1;
}
}
var maxCount = 0;
var maxCharIndex = [];
for (var key in objChar) {
if (maxCount < objChar[key]) {
maxCount = objChar[key];
maxCharIndex = [];
maxCharIndex.push(key);
} else if (maxCount == objChar[key]) {
maxCharIndex.push(key);
}
}
function getCount() {
return maxCount;
}
function getmaxChar() {
return maxCharIndex;
}
var objIndex = {};
var maxIndex = [];
for (var j = 0; j < maxCharIndex.length; j++) {
for (var i = 0; i < str.length; i++) {
if (str[i] == maxCharIndex[j]) {
maxIndex.push(i);
}
if (i == str.length - 1) {
objIndex[maxCharIndex[j]] = maxIndex;
maxIndex = [];
}
}
}
function getIndex() {
var maxIndex2 = [];
for (var key in objIndex) {
maxIndex2.push(key + "的索引为(" + objIndex[key] + ")");
}
return maxIndex2;
}
oIpt[1].value = getCount();
oIpt[2].value = getmaxChar();
oIpt[3].value = getIndex();
}
}