Question

我循环浏览了我的html主体中的所有类名。我想用classSize值存储classname。每次给定类名都有重复值时，我想增加其textSize。

$("*").each(function() {
    classname = $(this).get(0).className;
    myarray.push({"className" : classname, "textSize" : 5});

在这里，我尝试对类名进行排序，然后计算每个副本的计数：

myarray.sort();
var current = null;
var dupCount = 0;

for (var i = 0; i < myarray.length-1; i++) {
    if (myarray[i]["className"] !== "") {
        if (myarray.indexOf(myarray[i]["className"]) == -1) {
            log(myarray[i]["className"]);
        }
        else {
            log("DUP");
            myarray[i]["textSize"] = myarray[i]["textSize"] += 5;
            dupCount++;
        }
    }
}

log(myarray[i]["className"]);，如下图所示，清楚地显示了重复项：

enter image description here

然而，log("DUP");永远不会被召唤一次。那是为什么？

此外，为什么没有myarray.sort();按字母顺序对它们进行排序？如果它这样做，我可以if (myarray[i]["className"] === myarray[i++]["className"]) {来检查该值是否等于数组中的下一个值。但排序并不起作用。

编辑：

所以当循环时，我应该能够改变每个类名的css，对吗？

for(var classname in classes) {
    console.log(classes[classname].textSize);
    var $val = $(classes[classname]);                       
    $val.css({
        "color" : "blue",
        "fontSize": $val.textSize+"px"
    });
}

即使console.log(classes[classname].textSize);为每个元素提供文字大小

，这也不起作用

Answer 1

尝试使用对象而不是数组，使用类名作为键：

var classes = {};

$("*").each(function() {
    var classname = $(this).get(0).className;
    var c = classes[classname] || 
        (classes[classname] = { className: classname, textSize: 0 });
    c.textSize += 5;
});

for(var classname in classes) {
    console.log(classes[classname]);
}

请记住，任何元素都可以有多个类。如果您想要考虑到这一点，您将不得不拆分班级名称：

$("*").each(function() {
    var classnames = $(this).get(0).className.split(' ');
    for(var i=0; i<classnames.length; i++) {
        var classname = classnames[i];
        var c = classes[classname] || 
            (classes[classname] = { className: classname, textSize: 0 });
        c.textSize += 5;
    }
});

请参阅此演示：http://jsfiddle.net/FSBhv/

更新：OP明确表示他希望根据具有该类的元素数量在元素上设置文本大小。这样做会采用稍微不同的方法（我们实际上必须存储元素）：

var eltsByClass = {};

$("*").each(function() {
    var $this = $(this);
    $this.get(0).className.split(' ').forEach(function(cname) {
        var c = eltsByClass[cname] || 
            (eltsByClass[cname] = []);
        c.push($this.get(0));
    });
});

for(var cname in eltsByClass) {
    var elts = eltsByClass[cname];
    $(elts).css('font-size', (elts.length + 1) * 5 + 'px');
}

Answer 2

myarray.indexOf(myarray[i]["className"])是个问题。

您知道myarray仅包含对象，但您要求该列表中的字符串位置。除了-1之外，它永远不会返回任何内容。

考虑使用第二个数组存储频率计数，而不是尝试同时使用myarray。

var frequency = {};

myarray.forEach(function (i) {
  frequency[i.className] = frequency[i.className] || 0 
  frequency[i.className]++;
}

Answer 3

将数据存储在对象中，而不是数组中。它可以简化为：

var classes = {};

$("*").each(function() {
    var classname = $(this).get(0).className;
    classes[classname] = (classes[classname] || 0) + 5;
});

for(var classname in classes) {
    console.log(classname + " textSize:" + classes[classname]);
}

Answer 4

这将帮助您根据类名

按字母顺序对数组进行排序

    var myarray=[];
$("*").each(function() 
{
    classname = $(this).get(0).className;
    myarray.push({"className" : classname, "textSize" : 5});
});


function compare(a,b) 
{
  if (a.className < b.className)
     return -1;
  if (a.className > b.className)
    return 1;
  return 0;
}       

myarray.sort(compare);

计算js数组中的总重复数

4 个答案: