我遇到了一些 array[i] 未定义的错误，我找不到解决它的方法

Question

我在调度中心工作，我们使用“Astrid Netviewer”来规划我们的团队。 Netviewer 在 Firefox 浏览器中运行。我们被告知使用Netviewer的方式非常耗时，而且非常麻烦。

由于 Netviewer 是基于浏览器的，我想：“为什么我不应该将其自动化呢？”使用 JavaScript。

这是该过程的简单说明。在第一页，我们有几行/列。 “Ploeg ID”是团队的意思，每个团队都有几个员工，你可以在“人员”一栏中找到员工，每个员工都有自己的44xxxxx号码。

每个班次、一天结束时，我们都需要清除每个“Ploeg ID”中的所有信息。

我们该怎么做，在“Ploeg ID”栏中我们点击相应的“Ploeg ID”，例如GENT2203。我们被重定向到一个网页，例如

/netviewer/UnitID=GENT2203

。在该页面上，我们需要单击

"wis alle personeel/toestellen"

我们必须为超过 40 个团队执行此操作，每天 3 次...

我想做的是编写一个脚本，在html表中找到所有“PLOEG ID”，将它们放入一个数组中，删除数组中所有不必要的信息，循环遍历数组，打开'

"/netviewer/UnitID="+array[1]

' 并执行两次

get.Element

单击。

使用以下代码可以过滤掉“Ploeg ID”、“员工编号”并将它们全部放入一个数组中。我使用以下代码来执行此操作：

var tableObj = document.getElementById( "UnitItems" );
var arr = [];
var allTRs = tableObj.getElementsByTagName( "tr" );


for ( var trCounter = 0; trCounter < allTRs.length; trCounter++ )
{
    var tmpArr = [];
    var allTDsInTR = allTRs[ trCounter ].getElementsByTagName( "a" );
    for ( var tdCounter = 0; tdCounter < allTDsInTR.length; tdCounter++ )
    {
        tmpArr.push( allTDsInTR[ tdCounter ].innerHTML );
    }
    arr.push( tmpArr );
}
console.log( arr );

html代码（对不起图片）：

我用上面的代码得到的结果：

如您所见，我得到了一个嵌套数组，并且只需要该嵌套数组的第一个值，所以

arr[2][0]

。

但此时我陷入了困境......并且出现了错误。

这是我到目前为止的代码。因为我只需要 GENTXXXX 将

arr[]

中的第一个值推入新的

arrClear[]

中。

var tableObj = document.getElementById( "UnitItems" );
var arr = [];
var allTRs = tableObj.getElementsByTagName( "tr" );
var arrClean = [];


for ( var trCounter = 0; trCounter < allTRs.length; trCounter++ )
{
    var tmpArr = [];
    var allTDsInTR = allTRs[ trCounter ].getElementsByTagName( "a" );
    for ( var tdCounter = 0; tdCounter < allTDsInTR.length; tdCounter++ )
    {
        tmpArr.push( allTDsInTR[ tdCounter ].innerHTML );
    }
    arr.push( tmpArr );
}
//console.log( arr );

for (var j = 1; j < arr.length; j++){

        arrClean.push(arr[j][0]);
        arrClean[j] = arrClean[j].toString();   
        //window.open("/NetViewer/LineupsCommand/AddUnitInformation?unitID="+arrClean[j]+"&lineupName=Z_GENT_1_INT_MAANDAG_2&agencyID=Z_GENT", "_self");
        //document.getElementById("btnResetAllEmployees").click();
        //document.getElementById("btnAddUnitInformation").click();
}

但我收到以下错误“未捕获的类型错误：arrClean [j]未定义”。由于 typeError，我在

arrClean[j] = arrClean[j].toString();

后面添加了

arrClean.push(arr[j][0]);

？但这并不能解决问题。

如果我取消命令 window.open arrclean[j]，我会得到

/NetViewer/LineupsCommand/AddUnitInformation?unitID=undefined&lineupName=Z_GENT_1_INT_MAANDAG_2&agencyID=Z_GENT

如何解决未定义的错误？或者也许有一种更短的方法来解决我的问题？

我也尝试过，用 let 代替 var，但这似乎不起作用。我在堆栈上发现的第二个可能的解决方案是使用 foreach 而不是常规的 for 循环，但我无法理解它......

Answer 1

我用你的图片制作了一个粗略的 HTML。

对于我的答案，我使用 querySelectorAll 来获取表的所有 TD。

然后我循环遍历它们并查看 textContent 是否包含 GENT（这可以很容易地更改）。如果是，则推送 textContent，这将忽略锚点和其他 HTML。

const tds = document.querySelectorAll("#UnitItems td");
let ids = [];
tds.forEach((td) => {
  if (td.textContent.includes("GENT")) {
    ids.push(td.textContent)
  }
});

ids.forEach((id) => {
  console.log("/NetViewer/LineupsCommand/AddUnitInformation?unitID=" + id + "&lineupName=Z_GENT_1_INT_MAANDAG_2&agencyID=Z_GENT", "_self");
});

<table id="UnitItems">
  <tr>
    <td></td>
    <td><a href="">GENT202</a></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td><a href="">GENT2023</a></td>
    <td></td>
    <td></td>
  </tr>

  <tr>
    <td></td>
    <td><a href="">GENT2025</a></td>
    <td></td>
    <td></td>
  </tr>
</table>