如何从行/列循环中的表单元格提取超链接

Question

我有一个JS函数，可以将页面上表格的内容写入CSV文件。

但是，每当我遇到具有超链接的表单元格时（例如，

下面的代码显示了一个循环遍历行和列的函数。我以这种方式创建CSV没有问题，但是我正在努力实现的"check"

<script>
    function downloadCSV() {
        var table = document.getElementById("table-example");

        // Array of rowData arrays
        var results = []; 
        // holds data from each table row
        var rowData;

       //iterate through rows, skipping header 
        for (var i = 1, row; row = table.rows[i]; i++) {
            rowData = [];

            //iterate through columns
            for (var j = 0, col; col = row.cells[j]; j++) {

                // Checking for href and extracing link
                let link = $(this).find('a').attr('href');
                console.log(link);

                if () {
                     ....
                }

                else {
                    rowData.push(col.textContent);
                }   
            }
            results.push(rowData);  
        }

如果需要，示例表为：

<button onClick="downloadCSV()">Download CSV</button>

<table id="table-example">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td><a href="https://www.example.com">Tiger Nixon</a></td>
                <td>System Architect</td>
                <td>Edinburgh</td>
                <td>61</td>
                <td>2011/04/25</td>
                <td>$320,800</td>
            </tr>
        </tbody>
</table>

我的目标是实现一个if-else，如果表单元格有，我将向数组中添加href的值，如果没有，则添加html文本。但是，链接变量始终未定义，即使在我知道有

编辑：

根据Taplar的建议，在for循环中使用$（this）是错误的，我想出了以下解决方案：

            for (var j = 0, col; col = row.cells[j]; j++) {

                // Checking for href and extracing link
                var links = col.getElementsByTagName('a');

                if (links.length > 0) {
                    var cellData = links[0].getAttribute('href');
                } else {
                    var cellData = col.textContent;
                }

                rowData.push(cellData);




Answer 1

我的解决办法如下：

        for (var j = 0, col; col = row.cells[j]; j++) {

            // Checking for href and extracing link
            var links = col.getElementsByTagName('a');

            if (links.length > 0) {
                var cellData = links[0].getAttribute('href');
            } else {
                var cellData = col.textContent;
            }

            rowData.push(cellData);  

Answer 2

我和塔普拉就这件事争论不休。贝娄，我想这就是你要找的。

function downloadCSV() {

  var table = document.getElementById("table-example");

  // Array of rowData arrays
  var results = [];
  // holds data from each table row
  var rowData;

  for (var i = 1; row = table.rows[i]; i++) {
    rowData = [];

    //iterate through columns
    for (var j = 0, col; col = row.cells[j]; j++) {
      var cell = $(row.cells[j]);

      var hashref = cell.find('a');
      // Cause it get a collection
      if (hashref.length > 0 && hashref.length === 1) {
        rowData.push(hashref.attr('href'));
      } else {
        rowData.push(col.textContent);
      }
    } // end for cell
    results.push(rowData);
  } // end row

  console.log(results);

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button onClick="downloadCSV()">Download CSV</button>

<table id="table-example">
  <thead>
    <tr>
      <th>Name</th>
      <th>Position</th>
      <th>Office</th>
      <th>Age</th>
      <th>Start date</th>
      <th>Salary</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><a href="https://www.example.com">Tiger Nixon</a></td>
      <td>System Architect</td>
      <td>Edinburgh</td>
      <td>61</td>
      <td>2011/04/25</td>
      <td>$320,800</td>
    </tr>
  </tbody>
</table>