如何使用jQuery获取td值并存储在数组中?

时间:2019-06-11 23:12:09

标签: jquery arrays loops html-table

我正在寻找一种获取(第一,第二,第三等)td值并将其存储在数组中的方法。

使用each迭代td:

$("table tbody tr td").each(function(i,e){
        console.log($(this).html());
      });

使用此代码,我需要获取所有列的值,例如:

George
Princeton
Alabama
Pizza

如何使用相应的键Name, College, State, Food将这些值存储在数组中。我在想这个:

 var array = [];
$("table tbody tr td").each(function(i,e){
        array['Name'] = $(this) ??  //I dont know how get the first td. 
      });

我不知道这是否是迭代表的最佳方法,但我认为我在获取第一,第二,第三td值方面缺少一些东西。

表:(这只是一个示例,值是动态创建的)

<table >
    <tbody>
        <tr>
            <td> George </td>
            <td> Princeton </td>
            <td> Alabama </td>
            <td> Pizza </td>
        </tr>
        <tr>
            <td> Charli</td>
                <td> Princeton </td>
            <td> Alabama </td>
            <td> Milk Shake </td>
        </tr>
        <tr>
            <td> Max</td>
                <td> Princeton </td>
            <td> Alabama </td>
            <td> Rice </td>
        </tr>
        <tr>
            <td> Peter</td>
                <td> Princeton </td>
            <td> Alabama </td>
            <td> Fast Food </td>
        </tr>
    </tbody>
</table>

3 个答案:

答案 0 :(得分:1)

def modify_csv():
    df = pd.read_csv("Initial.csv")
    df['percent'] = pd.to_numeric(df["column 1"].str.rstrip('%'))
    df = df.loc[(df['percent'] < 50) & (df['percent'] > 0)]
    df = df.sort_values(by="percent", ascending=False)
    # Instead, you may want to keep the percent column and drop column 1, because numbers are more useful than numeric strings,
    # and whoever reads Final.csv may end up needing to strip the % signs again...
    df = df.drop('percent', axis=1)
    df.to_csv("Final.csv", na_rep=0, index=False)
const array = $("table tbody tr").map(function(i, row) {
  const data = $('td', row);
  return {
    Name: data.eq(0).text().trim(),
    College: data.eq(1).text().trim(),
    State: data.eq(2).text().trim(),
    Food: data.eq(3).text().trim()
  }
}).get();
console.log(array);

答案 1 :(得分:1)

尝试一下:

particles
$(function() {
  var keys = [];
  var myData = {};
  $("table thead th").each(function() {
    var k = $(this).text().trim().toLowerCase();
    keys.push(k);
    myData[k] = [];
  });
  $("table tbody tr").each(function(i, el) {
    $.each(keys, function(k, v) {
      myData[v].push($("td:eq(" + k + ")", el).text().trim());
    });
  });
  console.log(myData);
});

结果:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>College</th>
      <th>State</th>
      <th>Food</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td> George </td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Pizza </td>
    </tr>
    <tr>
      <td> Charli</td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Milk Shake </td>
    </tr>
    <tr>
      <td> Max</td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Rice </td>
    </tr>
    <tr>
      <td> Peter</td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Fast Food </td>
    </tr>
  </tbody>
</table>

如果需要对象数组,可以执行以下操作:

{
  "name": [
    "George",
    "Charli",
    "Max",
    "Peter"
  ],
  "college": [
    "Princeton",
    "Princeton",
    "Princeton",
    "Princeton"
  ],
  "state": [
    "Alabama",
    "Alabama",
    "Alabama",
    "Alabama"
  ],
  "food": [
    "Pizza",
    "Milk Shake",
    "Rice",
    "Fast Food"
  ]
}
$(function() {
  var keys = [];
  var myData = [];
  $("table thead th").each(function() {
    var k = $(this).text().trim().toLowerCase();
    keys.push(k);
  });
  $("table tbody tr").each(function(i, el) {
    var row = {}
    $.each(keys, function(k, v) {
      row[v] = $("td:eq(" + k + ")", el).text().trim();
    });
    myData.push(row);
  });
  console.log(myData);
});

结果:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>College</th>
      <th>State</th>
      <th>Food</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td> George </td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Pizza </td>
    </tr>
    <tr>
      <td> Charli</td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Milk Shake </td>
    </tr>
    <tr>
      <td> Max</td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Rice </td>
    </tr>
    <tr>
      <td> Peter</td>
      <td> Princeton </td>
      <td> Alabama </td>
      <td> Fast Food </td>
    </tr>
  </tbody>
</table>

希望有帮助。

答案 2 :(得分:0)

阅读this,我必须找到解决方案。

 $("#test").click(function(){

          var thvalues = $('table thead th').map(function(){
            return $(this).text();
          });

          var rows = $('table tbody tr').map(function(){
            var result = {};
            var values = $(this).find('td').map(function(){
              return $(this).text();
            });

          for(var i=0;i<thvalues.length;i++){
            result[thvalues[i]] = values[i];
          }

          return result
          }).toArray();

          console.log(thvalues);
          console.log(rows );

       }); // endAdd

结果

(2) [{…}, {…}]
0:
Name: " George "
State: " Alabama "
College: " Princeton "
Food: " Pizza "
__proto__: Object
1:
Name: " Peter "
State: " Alabama "
College: " Princeton "
Food: " Fast Food "
__proto__: Object
length: 2
__proto__: Array(0)