装载时出现问题<tr>文本转换为数组的元素

Having Issue on Loading <tr> text into Element of An Array

本文关键字：转换 文本 数组 元素 gt tr 问题 lt      更新时间：2023-09-26

你能看看这段代码，告诉我如何将每行<tr>的文本值存储在数组的元素中，并在<td> 之间添加空格吗

像这样的东西

arr = ["Jill, Smith, 50","Eve, Jackson, 94", "John, Doe, 80",... ]

现在发生的事情是我得到了这个结果！

["↵    Jill↵    Smith       ↵    50↵  ", "↵    Eve↵    Jackson      ↵    94↵  ", "↵    John↵    Doe     ↵    80↵  ", "↵    Mac↵    Raian        ↵    34↵  "]

这是我的代码

var arr = [];
$('#authors tr').each(function () {
    arr.push($(this).text());
});
console.log(arr);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="authors" style="width:100%">
  <tr>
    <td>Jill</td>
    <td>Smith</td>		
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>		
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>		
    <td>80</td>
  </tr>
    <tr>
    <td>Mac</td>
    <td>Raian</td>		
    <td>34</td>
  </tr>  
    
</table>

var arr = [];
$('#authors tr').each(function () {
  var tdval = '';  
  $(this).find('td').each(function(){
    tdval += $(this).text()+', ';
    })
    arr.push(tdval);
});
console.log(arr);

使用此代码

您可以使用map()而不是each()

  1. 使用map()迭代生成文本数组
  2. 使用get()检索文本数组
  3. 使用join()联接数组值

var arr = $('#authors tr').map(function() {
  return $('td', this).map(function() { // ietrate over td nside tr
      return $(this).text(); // return text content inside
    }).get().join() // get text array and join the array values with space          
}).get()
console.log(arr);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="authors" style="width:100%">
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
  <tr>
    <td>Mac</td>
    <td>Raian</td>
    <td>34</td>
  </tr>
</table>

使用jquery map和join()。

var arr = [];
$('#authors tr').each(function() {
  arr.push(
    $(this).find("td").map(function(i, o) {
      return $(o).text();
    }).get().join(",")
  )
});
console.log(arr);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="authors" style="width:100%">
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
  <tr>
    <td>Mac</td>
    <td>Raian</td>
    <td>34</td>
  </tr>
</table>

可能不是最优雅的方式，但这将达到的效果

var arr = [];
$('#authors tr').each(function () {
    arr.push($(this).text().trim().replace(/('n)/g, ','));
});
console.log(arr);

它基本上删除了开始和结束的新行，然后用逗号

替换其他新行
相关文章：