Question

我有一个自动生成的XML文件，我希望以HTML格式显示。

我采用了jQuery示例＆amp;扩展它以读取我的所有属性;

实例：http://dl.dropbox.com/u/3755926/jQuery/jQuery_report.html

是否可能存在超时错误，导致仅显示列标题？我以前从未处理过如此多的数据。或者它是每个元素的属性数量？此语法是否仅支持单个属性？

// Start function when DOM has completely loaded 
$(document).ready(function(){ 

// Open the xml file
$.get("Default.ass",{},function(xml){

    // Build an HTML string
    myHTMLOutput = '';
    myHTMLOutput += '<table width="98%" border="1" cellpadding="0" cellspacing="0">';
    myHTMLOutput += '<th>LookUp</th><th>TurnLeft</th><th>TurnRight</th><th>Flare1</th><th>Flare2</th><th>CutAway</th><th>Bergan</th><th>TurnWind</th><th>Flare3</th><th>HeadWindOffSet</th><th>DisT</th><th>Safe</th>';

    // Run the function for each student tag in the XML file
    //$('AAR_Assessments',xml).each(function(i) {
    $(xml).find("student").each(function(i) {
        LookUpTime = $(this).find("LookUp").attr("Time");
        LookUpAlt = $(this).find("LookUp").attr("Altitude");
        LookUpRes = $(this).find("LookUp").attr("Result");

        TurnLeftTime = $(this).find("TurnLeft").attr("Time");
        TurnLeftAlt = $(this).find("TurnLeft").attr("Altitude");
        TurnLeftRes = $(this).find("TurnLeft").attr("Result");

        TurnRightTime = $(this).find("TurnRight").attr("Time");
        TurnRightAlt = $(this).find("TurnRight").attr("Altitude");
        TurnRightRes = $(this).find("TurnRight").attr("Result");

        Flare1Time = $(this).find("Flare1").attr("Time");
        Flare1Alt = $(this).find("Flare1").attr("Altitude");
        Flare1Res = $(this).find("Flare1").attr("Result");

        Flare2Error = $(this).find("Flare2").attr("Error");

        CutAwayTime = $(this).find("CutAway").attr("Time");
        CutAwayAlt = $(this).find("CutAway").attr("Altitude");
        CutAwayRes = $(this).find("CutAway").attr("Result");

        BerganTime = $(this).find("Bergan").attr("Time");
        BerganAlt = $(this).find("Bergan").attr("Altitude");
        BerganRes = $(this).find("Bergan").attr("Result");

        TurnWindTime = $(this).find("TurnWind").attr("Time");
        TurnWindAlt = $(this).find("TurnWind").attr("Altitude");
        TurnWindRes = $(this).find("TurnWind").attr("Result");

        Flare3Error = $(this).find("Flare3").attr("Error");

        HeadWindOffSetTime = $(this).find("HeadWindOffSet").attr("Time");
        HeadWindOffSetAlt = $(this).find("HeadWindOffSet").attr("Altitude");
        HeadWindOffSetRes = $(this).find("HeadWindOffSet").attr("Result");

        DisTTime = $(this).find("DisT").attr("Time");
        DisTAlt = $(this).find("DisT").attr("Altitude");
        DisTRes = $(this).find("DisT").attr("Result");

        SafeError = $(this).find("Safe").attr("Error");

        // Build row HTML data and store in string
        mydata = BuildStudentHTML(  LookUpTime,LookUpAlt,LookUpRes,
                                    TurnLeftTime,TurnLeftAlt,TurnLeftRes,
                                    TurnRightTime,TurnRightAlt,TurnRightRes,
                                    Flare1Time,Flare1Alt,Flare1Res,
                                    Flare2Error,
                                    CutAwayTime,CutAwayAlt,CutAwayRes,
                                    BerganTime,BerganAlt,BerganRes,
                                    TurnWindTime,TurnWindAlt,TurnWindRes,
                                    Flare3Error,
                                    HeadWindOffSetTime,HeadWindOffSetAlt,HeadWindOffSetRes,
                                    DisTTime,DisTAlt,DisTRes,
                                    SafeError);
        myHTMLOutput = myHTMLOutput + mydata;
    });
    myHTMLOutput += '</table>';

    // Update the DIV called Content Area with the HTML string
    $("#ContentArea").append(myHTMLOutput);
});
});

function BuildStudentHTML(  LookUpTime,LookUpAlt,LookUpRes,
                        TurnLeftTime,TurnLeftAlt,TurnLeftRes,
                        TurnRightTime,TurnRightAlt,TurnRightRes,
                        Flare1Time,Flare1Alt,Flare1Res,
                        Flare2Error,
                        CutAwayTime,CutAwayAlt,CutAwayRes,
                        BerganTime,BerganAlt,BerganRes,
                        TurnWindTime,TurnWindAlt,TurnWindRes,
                        Flare3Error,
                        HeadWindOffSetTime,HeadWindOffSetAlt,HeadWindOffSetRes,
                        DisTTime,DisTAlt,DisTRes,
                        SafeError){ 
// Build HTML string and return
output = '';
output += '<tr>';
output += '<td>'+ LookUpTime +'<br />'+ LookUpAlt +'<br />'+ LookUpRes + '</td>';
output += '<td>'+ TurnLeftTime +'<br />'+ TurnLeftAlt +'<br />'+ TurnLeftRes + '</td>';
output += '<td>'+ TurnRightTime +'<br />'+ TurnRightAlt +'<br />'+ TurnRightRes + '</td>';
output += '<td>'+ Flare1Time +'<br />'+ Flare1Alt +'<br />'+ Flare1Res + '</td>';
output += '<td>'+ Flare2Error + '</td>';
output += '<td>'+ CutAwayTime +'<br />'+ CutAwayAlt +'<br />'+ CutAwayRes + '</td>';
output += '<td>'+ BerganTime +'<br />'+ BerganAlt +'<br />'+ BerganRes + '</td>';
output += '<td>'+ TurnWindTime +'<br />'+ TurnWindAlt +'<br />'+ TurnWindRes + '</td>';
output += '<td>'+ Flare3Error + '</td>';
output += '<td>'+ HeadWindOffSetTime +'<br />'+ HeadWindOffSetAlt +'<br />'+ HeadWindOffSetRes + '</td>';
output += '<td>'+ DisTTime +'<br />'+ DisTAlt +'<br />'+ DisTRes + '</td>';
output += '<td>'+ SafeError + '</td>';
output += '</tr>';
return output;
}

Answer 1

我会用jquery让你的生活更轻松。

这看起来是AJAX解析技术的一个很好的指南：

http://think2loud.com/224-reading-xml-with-jquery/

在HTML表格中使用jQuery显示非常简单的XML属性 - 这应该很简单

1 个答案: