Question

我对我正在进行的项目感到非常沮丧，如果表格中有重复的元素我想隐藏它们。我发现重复没有问题。当我试图隐藏重复项时，问题就开始了。我使用没有任何框架作品或库的vanilla JavaScript。我得到这个很难破译的错误。

未捕获类型错误：无法读取属性＆＃39; e＆＃39;未定义的

e是表格中的第一个重复元素

我的HTML中没有任何硬编码数据 - 它都是JavaScript。我以前从未做过这样的展示，所以我想我会伸手去寻求帮助。我的代码如下。

提前感谢您的帮助。

＆＃13;

var data = [
  ['e', 0, 1, 2, 3, 4],
  ['a', 54312, 235, 5, 15, 4],
  ['a', 6, 7, 8, 9, 232],
  ['a', 54, 11235, 345, 5, 6],
  ['b', 0, 1, 2, 3, 4],
  ['b', 54312, 235, 5, 15, 4],
  ['c', 62, 15, 754, 93, 323],
  ['d', 27, 11235, 425, 18, 78],
  ['d', 0, 1, 2, 3, 4],
  ['d', 54312, 235, 5, 15, 4],
  ['e', 6, 7, 8, 9, 232],
  ['e', 54, 11235, 345, 5, 6],
  ['e', 0, 1, 2, 3, 4],
  ['e', 54312, 235, 5, 15, 4],
  ['e', 62, 15, 754, 93, 323],
  ['e', 27, 11235, 425, 18, 78]
];





//Create a HTML Table element.
var table = document.createElement("TABLE");
var elems = document.getElementsByClassName("tableRow");


//Get the count of columns.
var columnCount = data[0].length;


//Add the data rows.

for (var i = 0; i < data.length; i++) {
  var row = table.insertRow(-1);
  for (var j = 0; j < columnCount; j++) {
    //Searching for duplicates            
    var num = data[i][0];
    for (var otherRow = i + 1; otherRow < data.length; otherRow++) {
      var dup = data[otherRow][0];
      console.log("What is the dup" + dup);
      if (num === dup) {
        console.log("duplicate");
        elems.data[dup].style.display = "none";

      }
    }


    var cell = row.insertCell(-1);
    cell.innerHTML = data[i][j];
    cell.innerHtml = myZero;

  }
}


var dvTable = document.getElementById("dvTable");
dvTable.innerHTML = "";
dvTable.appendChild(table);

＆＃13;

Answer 1

您可以分离重复数据删除并实际创建数据中的元素。使用Array.filter，您可以删除所有重复项，这样您在插入时就不必担心这一点。

＆＃13;

var data = [
  ['e', 0, 1, 2, 3, 4],
  ['a', 54312, 235, 5, 15, 4],
  ['a', 6, 7, 8, 9, 232],
  ['a', 54, 11235, 345, 5, 6],
  ['b', 0, 1, 2, 3, 4],
  ['b', 54312, 235, 5, 15, 4],
  ['c', 62, 15, 754, 93, 323],
  ['d', 27, 11235, 425, 18, 78],
  ['d', 0, 1, 2, 3, 4],
  ['d', 54312, 235, 5, 15, 4],
  ['e', 6, 7, 8, 9, 232],
  ['e', 54, 11235, 345, 5, 6],
  ['e', 0, 1, 2, 3, 4],
  ['e', 54312, 235, 5, 15, 4],
  ['e', 62, 15, 754, 93, 323],
  ['e', 27, 11235, 425, 18, 78]
];


var alreadyFound = [];

data = data.filter(function(item, pos, arr) {
  var key = item[0];
  // If we have already found this character, then skip.
  if (alreadyFound.indexOf(key) > -1) return false;
  // Otherwise, add this char to alreadyFound and include the item.
  alreadyFound.push(key);
  return true;
});


//Create a HTML Table element.
var table = document.createElement("TABLE");
var elems = document.getElementsByClassName("tableRow");


//Get the count of columns.
var columnCount = data[0].length;


//Add the data rows.

for (var i = 0; i < data.length; i++) {
  var row = table.insertRow(-1);
  for (var j = 0; j < columnCount; j++) {
    var cell = row.insertCell(-1);
    cell.innerHTML = data[i][j];
  }
}


var dvTable = document.getElementById("dvTable");
dvTable.innerHTML = "";
dvTable.appendChild(table);

＆＃13;

<div id="dvTable"></div>

＆＃13;

Answer 2

我同意红水星。首先需要删除数组中的重复项。红色水星答案是完全有效的，但这是一个脏的快速多维数组重复数据删除功能，我正在使用这些东西。

var data = [
    ['e', 0, 1, 2, 3, 4],
    ['a', 54312, 235, 5, 15, 4],
    ['a', 6, 7, 8, 9, 232],
    ['a', 54, 11235, 345, 5, 6],
    ['b', 0, 1, 2, 3, 4],
    ['b', 54312, 235, 5, 15, 4],
    ['c', 62, 15, 754, 93, 323],
    ['d', 27, 11235, 425, 18, 78],
    ['d', 0, 1, 2, 3, 4],
    ['d', 54312, 235, 5, 15, 4],
    ['e', 6, 7, 8, 9, 232],
    ['e', 54, 11235, 345, 5, 6],
    ['e', 0, 1, 2, 3, 4],
    ['e', 54312, 235, 5, 15, 4],
    ['e', 62, 15, 754, 93, 323],
    ['e', 27, 11235, 425, 18, 78]
];

function multiDimlUniq(arr) {
    var uniques = [];
    var founds = {};
    for (var i = 0, l = arr.length; i < l; i++) {
        var s = JSON.stringify(arr[i]);
        if (founds[s]) {
            continue;
        }
        uniques.push(arr[i]);
        founds[s] = true;
    }
    return uniques;
}

var reduced = multiDimlUniq(data)

由于未捕获的错误，表中的元素未被读取

2 个答案: