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

时间:2012-11-01 17:44:09

标签: javascript jquery html jqgrid

目前我在html中有一个jqGrid。我正在寻找一种从HTML元素而不是从jqGrid对象中提取数据的方法,并将每列放入一个数组中。我看了一堆例子,但却无法找到符合我需要的方式......

这就是我目前所拥有的。它拉取jgGrid,这是一个.d类并将其加载到dTags中。然后我抓住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看起来像这样......

table

生成的代码是..

<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文件。希望这可以解决一些问题。

2 个答案:

答案 0 :(得分:1)

您可以使用: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()处理程序中,以编程方式逐步指定每个列名称,而不是手动指定它们。

答案 1 :(得分:0)

目前还不是很清楚你想做什么,但初看起来你可以使用jqGrid的getCol方法而不是当前的代码。