JavaScript——读取表格-6ren

JavaScript——读取表格

转载作者：行者123 更新时间：2023-11-28 21:24:05

25

4

这是一个函数，当将表作为参数传递时，会对交替行应用不同的样式颜色以提高可读性。即第一行是深灰色，第二行是浅色，第三行是深灰色等。

如上所述，它作为参数传递整个表。所有行都没有 id。从这一行开始 var aTBODY = oTable.getElementsByTagName("tbody");，我明白发生了什么。也就是说，它获取表主体，然后获取其中的所有行，并交替对它们进行 strip 化。

1) 但是程序的前五行到底发生了什么？评论没有给我解释清楚。

2) 循环表长度(即 idArray.length)是否会创建行数组？ var id = idArray[indx]; 发生了什么？？

3)当它在注释中说，获取与此id对应的表时，使用代码var oTable = document.getElementById(id)为什么是这是必要的步骤吗？怎么了？

如果您能解释一下，谢谢

function createStripedTable(idArray) {
    // for each table ID that we're given, stripe all the rows.
    for (var indx = 0; indx < idArray.length; indx++) {
        var id = idArray[indx];
        // get the table that corresponds to this ID
        var oTable = document.getElementById(id);
        if (oTable == null) 
            return;

        // get its table body, which contains all the TR tags
        var aTBODY = oTable.getElementsByTagName("tbody");

        // set the CSS class for each one of the TR tags 
        for (var i = 0; i < aTBODY.length; i++) {
            // get an array of all the TR tags in the TBODY
            var aTR = aTBODY[i].getElementsByTagName("tr");

            for (var j = 0; j < aTR.length; j++) {  
                // the % operator divides the given number by another
                // and returns the remainder. This is how we alternate the
                // rows. 
                aTR[j].className = (j % 2 == 1) ? "stripe1" : "stripe2";
            }
        }
    }
}

这是调用它的代码。

function() {createStripedTable(new Array("MSFTQuotes"))

这是通过的唯一一张表的摘录。

<body>
    <table id="MSFTQuotes">
        <thead>
            <tr>
                <th colspan="7" align="center">
                    <span class="TableTitle">Stock Activity for Aug 5, 2008 - Nov 5, 2008 </span>
                </th>
            </tr>
            <tr>
                <th align="center" width="14%">
                    <div align="right" class="style5">
                        Date</div>
                </th>
                <th align="center" width="14%">
                    <div align="right" class="style5">
                        Open</div>
                </th>
                <th align="center" width="14%">
                    <div align="right" class="style5">
                        High</div>
                </th>
                <th align="center" width="14%">
                    <div align="right" class="style5">
                        Low</div>
                </th>
                <th align="center" width="14%">
                    <div align="right" class="style5">
                        Close</div>
                </th>
                <th align="center" width="14%">
                    <div align="right" class="style5">
                        Volume</div>
                </th>
                <th align="center" width="14%">
                    <div align="right" class="style5">
                        Adj Close</div>
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td align="right">
                    5-Nov-08
                </td>
                <td align="right">
                    29.21
                </td>
                <td align="right">
                    29.36
                </td>
                <td align="right">
                    29.03
                </td>
                <td align="right">
                    29.31
                </td>
                <td align="right">
                    95,337,696
                </td>
                <td align="right">
                    29.31
                </td>

最佳答案

该函数接受与 table 元素相对应的 id 值数组。它循环遍历这些 ID，并对表中的所有 tbody 元素执行 strip 化工作。

更多注释(请参阅TJC:s):

function createStripedTable(idArray) {
    // for each table ID that we're given, stripe all the rows.
    // TJC: Loop through all of the IDs in the given array
    for (var indx = 0; indx < idArray.length; indx++) {
        // TJC: Get the ID value for index `indx` in the array
        var id = idArray[indx];
        // get the table that corresponds to this ID
        var oTable = document.getElementById(id);
        if (oTable == null) // TJC: Invalid ID, ignore it
            return;

        // get its table body, which contains all the TR tags
        // TJC: Get the `tbody`s under the table. One table
        // can have multiple `tbody` elements.
        var aTBODY = oTable.getElementsByTagName("tbody");

        // set the CSS class for each one of the TR tags 
        for (var i = 0; i < aTBODY.length; i++) {
            // get an array of all the TR tags in the TBODY
            // TJC: It's actually a NodeList, but you can largely
            // treat it as an array
            var aTR = aTBODY[i].getElementsByTagName("tr");

            for (var j = 0; j < aTR.length; j++) {  
                // the % operator divides the given number by another
                // and returns the remainder. This is how we alternate the
                // rows. 
                    aTR[j].className = (j % 2 == 1) ? "stripe1" : "stripe2";
            }
        }
    }
}

好消息是IE9 finally supports nth-child pseudo-class ，所以有一天您将能够停止使用代码执行此操作。

关于JavaScript——读取表格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5498785/

25

4

0

文章推荐： javascript regexp 在字符串末尾找到第三个字符

文章推荐： python - 如何使用 Django ModelForm 将数据提交到数据库？

文章推荐： javascript - 改变克隆的对象，也改变原始对象 [Javascript]

文章推荐： javascript - Sinon spy 使用两种不同的回调签名

Python:Pandas 读取 csv:读取 csv 时向下转换
我遇到以下问题。我想读取一个包含数百万行和数百列的大型 csv。我想向下转换列的数据类型。我的方法是读取 csv，然后使用 pd.to_numeric() 对其进行向下转换。我不知道列数及其类型。在读
c# - 从 SQL Server 读取 - 需要从 CSV 读取
目前，我从 SQL server (2008) 数据库获取数据。 cyurrent的方法是使用DataTable，然后将其传递并使用。 if (parameters != null)
python - Dask 读取 csv 与 pandas 读取 csv
我有以下问题。我有一个巨大的 csv 文件，想用多处理加载它。对于一个包含 500000 行和 130 列不同数据类型的示例文件，Pandas 需要 19 秒。我试过 dask 因为我想多处理阅读。但
java - 读取 VC++ CArchive 二进制格式(或 Java 读取 (CObArray))
是否有关于用于序列化各种 MFC 数据结构的二进制格式的明确文档？我已经能够在十六进制编辑器中查看我自己的一些类，并使用 Java 的 ByteBuffer 类读取它们(使用自动字节顺序转换等)。但
javascript - 是否可以使用 javascript 读取 something.properties ？ (在 .hta 文件中)>> 读取 Selenium
我正在使用 Selenium 进行测试，我们用 HTML 文件编写测试用例，并用它们制作测试套件，我们的要求是编写足够健壮的测试用例，以根据测试环境改变自身。为此，我不希望在 HTML 脚本本身中包
读取.txt文件的Javascript代码
我需要一个 JavaScript 代码来读取存储为 .txt 文件的字典(或者也可以保存为任何其他类型的文件。它也可以在线获得)并将其内容存储在一个变量中。我不能找到一种让 JavaScript 像
java - 读取/过滤文本文件的最快方法是什么
我正在尝试遍历包含 SSH 登录和其他日志的日志文本文件。程序正在返回 SSH 登录的总数。我的解决方案确实有效，但似乎有点慢(在 200mo 文件上大约需要 3.5 秒)。我想知道是否有任何方法
vba - 读取/写入大量数据
我正在将大量数据从一个电子表格复制到工作簿中的其他 160 个电子表格。目前，Excel (2013) 遇到错误，因为它没有足够的资源来完成操作。我的目标是将工作表 4 中 V13:XI1150 范
VBA 读取/搜索文本文件
我正在尝试读取一个有 1147 行的文本文件。下面的代码仅读取第 1050-1147 行。我的目标是读取整个文件并提取位于不同行的特定值以在脚本中使用。一个示例是包含“BlockList: 2”的行中
Prolog 用户输入的时间限制(读取)
我正在为游戏编写解释器。用户将其移动输入解释器，程序执行该移动。现在我想为每个决定实现一个时间限制。玩家不应该能够思考超过 30 秒来写一个移动并按下回车。 call_with_time_limit
读取 HITRAN 文件格式
以this file例如，我正在尝试读取 data.frame 中的数据。来自 the doc (pdf 文件，表 1)，它遵循一些 fortran 约定。我尝试了以下但收效甚微: dir 0' 将
读取 R 的电子邮件附件
我正在使用 R 阅读 Outlook 附件。我的引用在这里:Download attachment from an outlook email using R 这是我的电子邮件的截图: 这每天都会发送
php xmlrpc 读取
我不会从表格中读取行来将主题放在列表中 php脚本 $url_obj='http://'.$host.':8069/xmlrpc/object'; $sock=new xmlrpc_client($u
读取 csv 但跳过字符串中的转义逗号
我有一个这样的 csv 文件: id,name,value 1,peter,5 2,peter\,paul,3 我如何读取此文件并告诉 R "\," 不表示新列，仅表示 ","。我必须添加该文件
macos - 读取 plist
我正在尝试读取 ~/Library/Preferences/com.apple.mail.plist (在 Snow Leopard 上)以获取电子邮件地址和其他信息以进入“关于”对话框。我使用以下代
bash - 读取 float
This question already has answers here: How do I use floating-point division in bash? (19个回答) 5个月前关闭
COBOL 读取/存储在表中
本练习的目标是读取输入文件并将其存储到表中，然后验证输入中的某些字段并输出任何错误记录。我需要读取并存储每个策略组，以便表中一次仅存储 5 条记录，而不是整个文件。所以我需要读取一个包含 5 条记录
Cassandra LWT 读取
据我了解，LWT 插入始终以 SERIAL 一致性级别完成。如果为 true，这是否意味着读取作为 LWT 插入的行可以安全地以 ANY 的一致性级别读取？换句话说，我假设 LWT 插入是完全一致的
JavaScript:读取 cookie
我看到很多很多通过java脚本读取cookie的函数，但我只想在变量中使用它一次，我是JS新手。这是我的代码 var TheNumber = (Math.random() + '') * 10000
c# - 读取.net中的程序集
我正在使用 asp.net 和 C#。我在服务器上部署了一个应用程序[已发布]，现在我想查看该网站的代码，据我所知，我可以阅读程序集来查看代码。请告诉我如何实现它。提前致谢。最佳答案您可以使用

首页

博学

6Ren·AI

商城

JavaScript——读取表格