jQuery将HTML表转换为XML [英] jQuery convert HTML Table to XML

问题描述

我正在使用以下jQuery代码从远程主机中检索HTML

I am retrieving HTML from a remote host with the following jQuery code

    var loadUrl = "URL.html"; 
        $("#result")
        .html(ajax_load)
        .load(loadUrl + " table.schedule");

哪个提供了以下HTML

Which gives me the following HTML

<table class="schedule">
        <tr>
                <th>Name</th>
                <th>column A</th>
                <th>column B</th>
        </tr>
        <tr>
                <td>1</td>
                <td>A1</td>
                <td>B1</td>
        </tr>
        <tr>
        <tr>
                <td>2</td>
                <td>A2</td>
                <td>B2</td>
        </tr>
</table>
<table class="schedule">
        <tr>
                <th>Name</th>
                <th>column C</th>
                <th>column D</th>
        </tr>
        <tr>
                <td>3</td>
                <td>C1</td>
                <td>D1</td>
        </tr>
        <tr>
        <tr>
                <td>4</td>
                <td>C2</td>
                <td>D2</td>
        </tr>
</table>

TR&的数量TD可以更改，我想检索A，B，C，D列的数据，然后将HTML转换"为类似于以下XML的列表格式.

The number of TR & TDs can change, and I want to retrieve the data for column A,B,C,D and "transform" the HTML into a list format like the following XML.

<schedule name="1">
        <data>A1</data>
        <data>A2</data>
</schedule>
<schedule name="2">
        <data>B1</data>
        <data>B2</data>
</schedule>
<schedule name="3">
        <data>C1</data>
        <data>C2</data>
</schedule>
<schedule name="4">
        <data>D1</data>
        <data>D2</data>
</schedule>

我尝试了以下代码，该代码为我提供了第一列数据，但也将两个表中的所有TD都连接到一个列表中.

I have tried the following code, which provides me with the first column data, but it also concatenates all the TDs from both Tables into one list.

$("#load_get").click(function(){
var xml = "<schedule>";
$("#result")
.find("tr").each(function() {
xml += "<data>";
xml += $(this).find("td").eq(1).html() + "\n";  
xml += "</data>";
} );
xml += "</schedule>";
alert(xml);
});

请帮助.

编辑

谢谢Polarblau，Federic&艾伯特的回应.他们提供了很多帮助，很抱歉更改了目标，但是如果我可以稍微修改一下方案的话.

Thank you Polarblau, Federic & Albert for your responses. They helped a lot, sorry to change the goal, but if i could modify the scenario slightly.

这是相同的HTML，不同之处在于它在第一个TR中有一个标头，有两个表，并且像以前一样忽略了第一列.

This is the same HTML, except it has a header in the first TR, there are two tables and the first column is ignored as before.

<table class="schedule">
        <tr>
                <th>ignore</th>
                <th>Header1</th>
                <th>header2</th>
        </tr>
        <tr>
                <td>ignore</td>
                <td>A1</td>
                <td>B1</td>
        </tr>
        <tr>
                <td>ignore</td>
                <td>A2</td>
                <td>B2</td>
        </tr>
</table>

//second table

我希望拥有的XML需要获取Header(TH)并在TD循环中使用它来设置name属性，就像这样.

The XML i wish to have, needs to grab the Header(TH) and use it in the TD loop to set the name attribute, like so.

<schedule name="Header1">
        <data>A1</data>
        <data>A2</data>
</schedule>
<schedule name="Header2">
        <data>B1</data>
        <data>B2</data>
</schedule>

//second table xml

我尝试修改您的解决方案以实现这一目标，但未成功.

I tried unsuccessfully, to modify your solutions to achieve this.

推荐答案

如果我正确理解了您的问题，则需要在循环内创建<schedule>元素:

If I understand your question correctly, you need to create the <schedule> elements inside your loop:

$("#load_get").click(function() {
    var xml = "";
    $("#result tr").each(function() {
        var cells = $("td", this);
        if (cells.length > 0) {
            xml += "<schedule name='" + cells.eq(0).text() + "'>\n";
            for (var i = 1; i < cells.length; ++i) {
                xml += "\t<data>" + cells.eq(i).text() + "</data>\n";
            }
            xml += "</schedule>\n";
        }
    });
    window.alert(xml);
});

这篇关于jQuery将HTML表转换为XML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！