

ご覧になって頂いてありがとうございます。  
以下の様な table が配置してある HTML から TypeScript にて要素を取得しました。

[code]

    <body>
      <table id="test_table">
        <tbody>
          <tr>
            <td></td><td></td><td></td>
          </tr>
          <tr>
            <td></td><td></td><td></td>
          </tr>
          <tr>
            <td></td><td></td><td></td>
          </tr>
        </tbody>
      </table>
    
      <script src="./js/main.js"></script>
    </body>
    
[/code]

[code]

    addEventListener('load', () => {
      const table = <HTMLTableElement>document.getElementById('test_table');
      for (let row of table.rows) {
        for (let cell of row.cells) {
            cell.textContent = 'test';
        }
      }
    });
    
[/code]

しかし、`for (let row of table.rows)` にて、  
`型 'HTMLCollectionOf<HTMLTableRowElement>' は配列型でも文字列型でもありません。ts(2495)`  
というエラーが発生してしまいます。  
![画像](https://i.stack.imgur.com/sF3kE.png)  
このような場合での正しい記述方法等がありましたら教えて頂きたいです。

## 環境

  * TypeScript 3.9.6  
tsconfig.jsonは以下の様になっております

[code]

    {
      "compilerOptions": {
        "target": "ES3",
        "module": "UMD",
        "strict": true,
        "esModuleInterop": true,
        "skipLibCheck": true,
        "forceConsistentCasingInFileNames": true
      }
    }
    
[/code]

不足している情報等がありましたら、加筆させて頂きます。  
以上、よろしくお願いいたします。


CC BY-SA 4.0
2020-07-02T02:13:19.003
68203
2021-10-04T01:05:45.533
40899
question
typescript
TypeScript で取得した HTML のテーブルを for でループしたい


`rows`や`cells`は`ArrayLike`ですが`Iterable`ではないので`Array.form`で配列にすると`for of`を使えます。

[code]

    const table = <HTMLTableElement>document.getElementById('test_table');
    for (let row of Array.from(table.rows)) {
        for (let cell of Array.from(row.cells)) {
            cell.textContent = 'test';
        }
    }
    
[/code]


CC BY-SA 4.0
2020-07-02T03:06:41.410
68206
2020-07-02T03:06:41.410
241
68203
answer