使用JavaScript或JQuery将HTML表转换为XML [英] Convert HTML table into XML using JavaScript or JQuery

问题描述

我有这个动态创建的HTML表，我希望将其转换为XML(请参见下面的xml输出)

I have this dynamically created HTML table and I’m looking to convert it into XML(see below xml output)

 <table id="GridView1">
 <tr>
    <th>Class</th>
    <th>1995</th>
    <th>1996</th>
    <th>1997</th>
 </tr>
 <tr>
    <td>Class1</td>
    <td>
        <select name="ddlStatus"">
           <option value="Phase I">Phase I</option>
           <option selected="selected" value="Phase II">Phase II</option>
           <option value="Phase III">Phase III</option>
        </select>
    </td>
    <td>
        <select name="ddlStatus">
           <option value="Phase I">Phase I</option>
           <option selected="selected" value="Phase II">Phase II</option>
           <option value="Phase III">Phase III</option>
        </select>
    </td>
    <td>
        <select name="ddlStatus">
           <option value="Phase I">Phase I</option>
           <option value="Phase II">Phase II</option>
           <option selected="selected" value="Phase III">Phase III</option>
        </select>
    </td>
 </tr>
 <tr>
   <td>Class2</td>
   <td>
        <select name="ddlStatus"">
               <option value="Phase I">Phase I</option>
               <option value="Phase II">Phase II</option>
           <option selected="selected" value="Phase III">Phase III</option>
        </select>
   </td>
   <td>
        <select name="ddlStatus">
               <option value="Phase I">Phase I</option>
               <option selected="selected" value="Phase II">Phase II</option>
           <option value="Phase III">Phase III</option>
        </select>
   </td>
   <td>
        <select name="ddlStatus">
           <option value="Phase I">Phase I</option>
           <option value="Phase II">Phase II</option>
           <option selected="selected" value="Phase III">Phase III</option>
        </select>
   </td>
 </tr>
 </table>

这是我正在使用的功能，我需要一些帮助来解析下拉框所选项目

This is the function I’m working on, and I need some help to parse out the dropdown box selected item

var xml = '<?xml version="1.0" encoding="utf-8"?>';
xml = xml + '<Root><Classes>';

$("#<%=Me.GridView1.ClientID %> tr").each(function () {
var cells = $("td", this);
    if (cells.length > 0) {
        xml += "<Class Name='" + cells.eq(0).text() + "'>";

        for (var i = 1; i < cells.length; ++i) {
             xml += '<Data year="' + $("#GridView1").find("th").eq(i).text()  + '" status="' + $("option:selected",cells.eq(i)).text() + '"/>';
        }

        xml += "</Class>";
     }
});

xml = xml + '</Classes></Root>'

这就是我希望XML输出在解析后的样子.

And this is how I would like the XML output to look like after parsing.

<?xml version="1.0" encoding="utf-8"?>
 <Root>
  <Classes>
    <Class Name="Class1">
       <Data Year="1995" Status="Phase II" />
       <Data Year="1996" Status="Phase II" />
       <Data Year="1997" Status="Phase III" />
     </Class >
     <Class Name="Class2">
       <Data Year="1995" Status="Phase III" />
       <Data Year="1996" Status="Phase II" />
       <Data Year="1997" Status="Phase III" />
     </Class >
   </ Classes >
 </Root>

上面的jquery函数现在可以使用了.如果有人可以提出漂亮的JavaScript示例，将不胜感激.

The above jquery function works now. If anybody can come up with nice JavaScript example, will be greatly appreciate it.

谢谢

推荐答案

在您的for循环中尝试此操作

Try this inside your for loop

xml += '<Data year="' + $("#GridView1").find("th").eq(i).text()  + '" status="' + $("option[selected]",cells.eq(i)).text() + '"/>';

演示

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