如何使用javascript显示所有表行

时间:2014-02-05 15:12:17

标签: javascript jquery html css excel

每天我都要将网页表格中的所有数据复制并粘贴到Excel中;有超过100个表,每个表包含10行,每行是一个链接。当我点击它时它将展开并显示其内容,但是当我点击第2行时,第1行内容将自动隐藏,当我点击第3行时,第2行和其他内容也将自动隐藏。 ..

所以我需要逐行点击第1行以显示其内容并将粘贴复制到Excel中,这既繁琐又费时。

当我打开网页时,是否有任何方法会导致网页展开其所有树内容,或者当我点击其他链接时链接不会自动隐藏其内容?这是一个网站示例:

我已经要求我的老板登录并分享他的数据,这是我需要为他工作的额外工作。

这个表由10行组成,每个第1个单元格都是链接,当我打开网站时,10行的内容全部隐藏,当我点击第1行的第1个单元格时,第1行HTML将显示为:

<tr class="shown">
<td colspan="4" class="betslip cc" id="6088535226">
    <input type="hidden" name="maxwin" value="4133000" xmlns:histman="urn:histman">
    <input type="hidden" name="tOType" id="tOType" value="">
    <input type="hidden" name="txtBetConfirmBankerData" id="txtBetConfirmBankerData" value="">
    <input type="hidden" name="txtBetCountBanker" id="txtBetCountBanker" value="0">
    <input type="hidden" name="txtBetCountNonBanker" id="txtBetCountNonBanker" value="1">
    <table id="betSlip" class="bst" xmlns:histman="urn:histman">
        <tbody>
            <tr>
                <td class="details">
                    <table id="tblHeading" class="bsdt" xmlns:fo="http://www.w3.org/1999/XSL/Format" xmlns:msxsl="urn:schemas-microsoft-com:xslt" xmlns:rs="urn:schemas-microsoft-com:rowset" xmlns:z="#RowsetSchema">
                        <tbody>
                            <tr class="nbt">
                                <td class="nbr first" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;"> <span class="b f11 nobr inblock">Bet Confirmation
    &nbsp;-&nbsp;SH3084343910F
      &nbsp;-&nbsp;Flash
    &nbsp;
  </span>

投注时间:         04/02/2014 06:39:26

                                </td>
                                <td class="print last" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;"> <a href="#" onclick="javascript: BetConfirm.OnPrintClick(); return false;">Print</a>

                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr id="subheading" class="lft nbt subheading">
                <td>Selections</td>
            </tr>
            <tr>
                <td class="details">
                    <table id="tblNormal" class="bsdt">
                        <tbody>
                            <tr class="header nbb">
                                <th class="ctr c38 first" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;">No.</th>
                                <th class="lft c171 mid" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;">Selections</th>
                                <th class="lft c208 mid" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;">Event</th>
                                <th class="ctr c78" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;">Event Date</th>
                                <th class="ctr c71" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;">E/W Terms</th>
                                <th class="ctr c59" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;">Odds</th>
                                <th class="ctr c61 last" style="background-image: url(/MEMBERS/images/common/history/table-header-2.gif); background-repeat: repeat-x;">Result</th>
                            </tr>
                            <input type="hidden" name="txtPartTypes" value="N,">
                            <input type="hidden" name="txtPDPitchersID" id="txtPDPitchersID">
                            <input type="hidden" name="txtPDTeam1ID" id="txtPDTeam1ID">
                            <input type="hidden" name="txtPDTeam2ID" id="txtPDTeam2ID">
                            <input type="hidden" name="txtPDBetSlipPartID" id="txtPDBetSlipPartID">
                            <tr class="nbb">
                                <td class="rgt first">1</td>
                                <td class="lft">高于 9.0</td>
                                <td class="lft">维拉利尔队 v 奥萨苏纳队
                                    <br>(附加角球总数)</td>
                                <td class="ctr">04/02/2014</td>
                                <td class="ctr">None</td>
                                <td class="ctr" nowrap="nowrap">11.00</td>
                                <td class="ctr last">Lost</td>
                            </tr>
                            <tr class="nbb">
                                <td colspan="8" class="first last b">Stake:&nbsp; 16.00 &nbsp; Returns:&nbsp; 0.00 &nbsp;</td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
    <div class="noteToWin" xmlns:histman="urn:histman">'Return' values are subject to maximum payouts as detailed in our rules.</div>
</td>

这是共享链接http://jsfiddle.net/engchiang/ghP2a/6/ 第1行的HTML将显示为:tr class =“shown”,其他9行HTML将显示为:tr class =“hidden”

然后我点击第二行的第一个单元格,第一行HTML将显示为:

<tr class="hidden" disabled="true">
<td colspan="4" class="betslip cc" id="6088535226"></td>

这是共享链接http://jsfiddle.net/engchiang/ghP2a/7/ 然后第一行内容将自动隐藏,第二行的HTML将显示为:tr class =“shown”,第一行的HTML将显示为:tr class =“hidden”disabled =“true”

然后当我点击第3行中的第1个单元格时,它显示第3行内容并隐藏其他行内容......

0 个答案:

没有答案