首先,我知道这个标题有点令人困惑,但是我将解释我想做什么。
我创建了一个简单的.html和.js文件,该文件具有不同的div标签。我使用for循环循环了div标签,并且div容器的文本应添加到我创建的表中。
<HTML>
<head>
</head>
<body>
<div id="divContainer">
<div class="div">
one
</div>
<div class="div">
two
</div>
<div class="div">
three
</div>
<div class="div">
four
</div>
<div class="div">
five
</div>
<div class="div">
six
</div>
</div>
<table id="table">
</table>
<p id="output">
</p>
</body>
</HTML>
JavaScript文件:
var divLists = document.getElementsByClassName('div');
window.onload = function() {
for (i = 0; i < divLists.length; i++) {
var divList = divLists[i];
divList.onclick = function() {
x(this.innerHTML);
}
}
};
function x(y) {
var table = document.getElementById('table');
var Row = table.insertRow();
var Cell = Row.insertCell(0);
var newText = document.createTextNode(y);
Cell.appendChild(newText);
}
我也将代码放在jsfiddle中:https://jsfiddle.net/avj4zg21/11/
因此,通过单击“一个”,“两个”,“三个”,...,它将被添加到表中,但它想要添加一个计数器。因此,例如,如果我单击一个,则应将其添加到表格中;如果单击第二或第三次,则该名称后面应有一个计数器,例如:“一个(按3次)”。
提前谢谢您
您可以使用Map
跟踪单击的项目并增加现有的项目:
var divLists = document.getElementsByClassName('div');
window.onload = function() {
for (i = 0; i < divLists.length; i++) {
var divList = divLists[i];
divList.onclick = function() {
x(this.innerHTML);
}
}
};
let map = {};
function checkNumber(number){
if(map[number])
map[number] = map[number] + 1;
else
map[number] = 1;
return map[number];
}
function x(y) {
var table = document.getElementById('table');
let rows = table.rows;
let count = checkNumber(y);
var Row = table.insertRow();
var Cell = Row.insertCell(0);
Cell.innerHTML = count;
Cell = Row.insertCell(0);
Cell.innerHTML = y;
}
<HTML>
<head>
</head>
<body>
<div id="divContainer">
<div class="div">
one
</div>
<div class="div">
two
</div>
<div class="div">
three
</div>
<div class="div">
four
</div>
<div class="div">
five
</div>
<div class="div">
six
</div>
</div>
<table id="table">
</table>
<p id="output">
</p>
</body>
</HTML>