Jquery 从xml解析后，使用j query和html5随机显示数据

你好，我是HTML5和j查询的新手。我必须成功地从XML解析数据。现在解析数据后，我想使用j query随机显示它。请建议我如何执行此操作

代码片段是

 // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.open("GET","xml/multiquestions1.xml",false);
    xmlhttp.send();
    xmlDoc=xmlhttp.responseXML;     

    var x=xmlDoc.getElementsByTagName("question");
    $(document).ready(function (){
        for(var j=0;j<x.length;j++)
        {
            if(j==0)
            {
                $("#navigationlist").append('<li><a href="#" id="selected_link"  class="navg" onClick="display_nav('+j+',this);">'+(j+1)+'</a></li>');   
                display_nav(j,$("#selected_link"))
            }
            else
                $("#navigationlist").append('<li><a href="#" class="navg" onClick="display_nav('+j+',this);">'+(j+1)+'</a></li>');   
        }               
    });

function display()
    {
        // for fetch question
        Description=(x[i].getElementsByTagName("questionTxt")[0].childNodes[0].nodeValue);
        Answer =(x[j].getElementsByTagName("image")[0].childNodes[0].nodeValue);

        document.getElementById('options').style.backgroundImage = 'url('+Answer+')';

        // Assign the value
        document.getElementById("question").innerHTML= Description; 

    }   

function display_nav(j,obj)
    {
       i=j;
       $("#feedback").html(""); 
        $(".navg").each(function(){

           $(this).removeAttr("id");                         
        });

        $(obj).attr("id","selected_link");
        Description=(x[j].getElementsByTagName("questionTxt")[0].childNodes[0].nodeValue);
        Answer =(x[j].getElementsByTagName("image")[0].childNodes[0].nodeValue);
        answermin=(x[j].getElementsByTagName("answermin")[0].childNodes[0].nodeValue);
        answermax=(x[j].getElementsByTagName("answermax")[0].childNodes[0].nodeValue);

        $("#bob").attr("min",answermin);
        $("#bob").attr("max",answermax);
        $("#bob").attr("value",0);
        $("#out").html(0);
        $("#out").css({left:0});

        // Assign the value
        document.getElementById("question").innerHTML= Description;
        //document.getElementById("options").style.backgroundImage = url(Answer);
        document.getElementById('options').style.backgroundImage = 'url('+Answer+')';       
    }   

and xml is

<?xml version="1.0" encoding="utf-8"?>
<FlashCards>
  <question id="1">
    <questionTxt type="text"><![CDATA[Hello!]]></questionTxt>
<image visible="true"><![CDATA[img/smiley1.png]]></image>
    </question>  
 <question id="2">
    <questionTxt type="text"><![CDATA[Hi]]></questionTxt>
<image visible="true"><![CDATA[img/smiley2.png]]></image>

</question> 
</FlashCards>

//IE7+、Firefox、Chrome、Opera、Safari的代码
xmlhttp=新的XMLHttpRequest（）；
}否则{
//IE6、IE5的代码
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
open（“GET”，“xml/multiquestions1.xml”，false）；
xmlhttp.send（）；
xmlDoc=xmlhttp.responseXML；
var x=xmlDoc.getElementsByTagName（“问题”）；
$（文档）.ready（函数（）{
对于（var j=0；j

jQuery自带了自己的解析函数

jQuery.parseXML（）

->

然后，您可以更容易地在解析的xml的顶部进行搜索

var xml = $.parseXML(xmlString),
    // find and count all questions
    questionCount = xml.find('question').length();
// find a random question out of the pool
xml.find('question#'+ Math.floor(Math.random() * (questionCount + 1))):

---

我没有测试它，但我希望你能理解这一点。

既然你使用jquery，你就应该在所有东西上都使用它。像

getElementsByTagName，getElementById

，甚至整个

xmlhttp

部分都不需要。这将为你节省大量的输入和痛苦。没有得到：（.你能详细说明我应该在哪里做更改吗？1.例如，你在开始时的整个请求可以通过一个简单的方法完成：

$。get（）

，

getElementsByTagName

可以替换为

$（'tagName'）

，

getElementById

替换为

$（'idName'））

…你应该更深入地研究jQuery。2.你发布的代码看起来相当复杂，没有多少人愿意深入研究并找出错误。你应该把它减少到真正需要的程度。此外，像i、j、s、x这样的变量也不是很有用。要找出它们的用途需要很多时间。