繁体   English   中英

jQuery从HTML表获取元素并按列放入数组

[英]Jquery get elements from HTML table and put into arrays by column

目前,我在html中有一个jqGrid。 我正在寻找一种从HTML元素(而不是jqGrid对象)提取数据并将每一列放入数组的方法。 我查看了很多示例,但找不到适合我需要的方法。

这就是我目前所拥有的。 它将拉出一个.d类的jgGrid并将其加载到dTag中。 然后,我获取tableId并尝试提取行数据(我实际上只需要使用列数据作为示例),就没有运气了。 任何帮助将非常感激。

function generateXML()
{
    // get class tags d, np, ch
    var dTags = $(".d");
    var npTags = $(".np");
    var chTags = $(".ch");

    for(var i = 0; i<dTags.size(); i++)
    {
        log(dTags.size());
        var tableId = dTags[i].id;
    var tableName = "#" + tableId + " td:nth-child(0)";
    log(tableName);
    var colArray = $(tableName).map(function(){
        return $(this).text();
    }).get();
    log(JSON.stringify(colArray));
    }
}

HTML-看起来像这样

<table id="polarizationTable" class="d" ></table>

jqGrid生成的html看起来像这样...

表

以及生成该代码的代码是..

<div class="ui-jqgrid ui-widget ui-widget-content ui-corner-all" id="gbox_polarizationTable" dir="ltr" style="width: 729px; "><div class="ui-widget-overlay jqgrid-overlay" id="lui_polarizationTable"></div><div class="loading ui-state-default ui-state-active" id="load_polarizationTable" style="display: none; ">Loading...</div><div class="ui-jqgrid-view" id="gview_polarizationTable" style="width: 729px; "><div class="ui-jqgrid-titlebar ui-widget-header ui-corner-top ui-helper-clearfix"><a role="link" href="javascript:void(0)" class="ui-jqgrid-titlebar-close HeaderButton" style="right: 0px; "><span class="ui-icon ui-icon-circle-triangle-n"></span></a><span class="ui-jqgrid-title">Polarization Table</span></div><div style="width: 729px; " class="ui-state-default ui-jqgrid-hdiv"><div class="ui-jqgrid-hbox"><table class="ui-jqgrid-htable" style="width: 711px; " role="grid" aria-labelledby="gbox_polarizationTable" cellspacing="0" cellpadding="0" border="0"><thead><tr class="ui-jqgrid-labels" role="rowheader"><th id="polarizationTable_TestTime" role="columnheader" class="ui-state-default ui-th-column ui-th-ltr" style="width: 97px; "><span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize; ">&nbsp;</span><div id="jqgh_polarizationTable_TestTime" class="ui-jqgrid-sortable">Minutes<span class="s-ico" style="display:none"><span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span><span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span></span></div></th><th id="polarizationTable_RdgA" role="columnheader" class="ui-state-default ui-th-column ui-th-ltr" style="width: 97px; "><span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize; ">&nbsp;</span><div id="jqgh_polarizationTable_RdgA" class="ui-jqgrid-sortable">Reading A<span class="s-ico" style="display:none"><span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span><span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span></span></div></th><th id="polarizationTable_CorrA" role="columnheader" class="ui-state-default ui-th-column ui-th-ltr" style="width: 97px; "><span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize; ">&nbsp;</span><div id="jqgh_polarizationTable_CorrA" class="ui-jqgrid-sortable">Corr A<span class="s-ico" style="display:none"><span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span><span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span></span></div></th><th id="polarizationTable_RdgB" role="columnheader" class="ui-state-default ui-th-column ui-th-ltr" style="width: 97px; "><span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize; ">&nbsp;</span><div id="jqgh_polarizationTable_RdgB" class="ui-jqgrid-sortable">Reading B<span class="s-ico" style="display:none"><span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span><span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span></span></div></th><th id="polarizationTable_CorrB" role="columnheader" class="ui-state-default ui-th-column ui-th-ltr" style="width: 97px; "><span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize; ">&nbsp;</span><div id="jqgh_polarizationTable_CorrB" class="ui-jqgrid-sortable">Corr B<span class="s-ico" style="display:none"><span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span><span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span></span></div></th><th id="polarizationTable_RdgC" role="columnheader" class="ui-state-default ui-th-column ui-th-ltr" style="width: 97px; "><span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize; ">&nbsp;</span><div id="jqgh_polarizationTable_RdgC" class="ui-jqgrid-sortable">Reading C<span class="s-ico" style="display:none"><span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span><span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span></span></div></th><th id="polarizationTable_CorrC" role="columnheader" class="ui-state-default ui-th-column ui-th-ltr" style="width: 94px; "><span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize; ">&nbsp;</span><div id="jqgh_polarizationTable_CorrC" class="ui-jqgrid-sortable">Corr C<span class="s-ico" style="display:none"><span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span><span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span></span></div></th></tr></thead></table></div></div><div class="ui-jqgrid-bdiv" style="height: 250px; width: 729px; "><div style="position:relative;"><div></div><table id="polarizationTable" class="d ui-jqgrid-btable" tabindex="1" cellspacing="0" cellpadding="0" border="0" role="grid" aria-multiselectable="false" aria-labelledby="gbox_polarizationTable" style="width: 711px; "><tbody><tr class="jqgfirstrow" role="row" style="height:auto"><td role="gridcell" style="height: 0px; width: 97px; "></td><td role="gridcell" style="height: 0px; width: 97px; "></td><td role="gridcell" style="height: 0px; width: 97px; "></td><td role="gridcell" style="height: 0px; width: 97px; "></td><td role="gridcell" style="height: 0px; width: 97px; "></td><td role="gridcell" style="height: 0px; width: 97px; "></td><td role="gridcell" style="height: 0px; width: 94px; "></td></tr><tr role="row" id="1" tabindex="0" class="ui-widget-content jqgrow ui-row-ltr ui-state-highlight" aria-selected="true"><td role="gridcell" style="text-align:center;" title="0.25" aria-describedby="polarizationTable_TestTime">0.25</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="2" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="0.5" aria-describedby="polarizationTable_TestTime">0.5</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="3" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="0.75" aria-describedby="polarizationTable_TestTime">0.75</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="4" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="1" aria-describedby="polarizationTable_TestTime">1</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="5" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="2" aria-describedby="polarizationTable_TestTime">2</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="6" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="3" aria-describedby="polarizationTable_TestTime">3</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="7" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="4" aria-describedby="polarizationTable_TestTime">4</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="8" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="5" aria-describedby="polarizationTable_TestTime">5</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="9" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="6" aria-describedby="polarizationTable_TestTime">6</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="10" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="7" aria-describedby="polarizationTable_TestTime">7</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="11" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="8" aria-describedby="polarizationTable_TestTime">8</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="12" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="9" aria-describedby="polarizationTable_TestTime">9</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr><tr role="row" id="13" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr"><td role="gridcell" style="text-align:center;" title="10" aria-describedby="polarizationTable_TestTime">10</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrA">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrB">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_RdgC">&nbsp;</td><td role="gridcell" style="text-align:center;" title="" aria-describedby="polarizationTable_CorrC">&nbsp;</td></tr></tbody></table></div></div></div><div class="ui-jqgrid-resize-mark" id="rs_mpolarizationTable">&nbsp;</div></div>

本质上,我需要将Minutes,Reading A,Corr A等中的数据放入各自的数组中……稍后,我将根据该数据构建自定义XML文件。 希望这能使事情顺利进行。

您可以使用:nth-child.map()函数:

var minutes = jQuery('.ui-jqgrid-bdiv tr.ui-widget-content td:nth-child(1)')
  .map(function(){
    return $(this).html();
  });

var readingA = jQuery('.ui-jqgrid-bdiv tr.ui-widget-content td:nth-child(2)')
  .map(function(){
    return $(this).html();
  });

/// and so on...

通过一些工作,您可以将其包装在.each()处理程序中,以编程方式步进每个列名,而不是手动指定它们。

尚不清楚要做什么,但是乍一看 ,您可以仅使用jqGrid的getCol方法代替当前代码。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM