使用httpRequestXML请求xml文档如何使用javascript

时间:2017-12-07 18:42:54

标签: javascript html xml

我需要帮助运行if和else语句,它将使用XMLRequest检索一定数量的条目,并且只返回10个条目而不是30个。我想在如何创建一个能够获得下一组条目的函数方面提供一些帮助将第一次获得5个条目,然后第二次点击获得10个条目等等...我被困住了,真的很想明白我没看清楚

<!DOCTYPE html>
<html lang="en">
<head>
    <title>AJAX High Score Example</title>
    <style>
        body {              background-color:   lightgreen; }
        h1 {                color:              black;
                            text-align:         center;}
        button {            display:            block;
                            margin-left:        auto;
                            margin-right:       auto; }
        #box1 {             background-color:   grey;
                            color:              green;
                            border:             2px solid black;
                            width:              550px;
                            padding:            20px;
                            margin-left:        auto;
                            margin-right:       auto;  }
        th, td {            color:              black;
                            min-width:          120px;
                            text-align:         center;
                            border:             1px solid black;}
        table {             margin:             20px auto 0px auto;
                            border:             5px solid black;
                            background-color:   yellow;}
    </style>
    </head>
    <body>
     <h1>Cedrics Music List 1990 XML Part A</h1>
     <div id="box1"></div>
     <button type="button" onclick="getScores()">Display 
     Scores</button>


    <script>
        var request1;
        var ratingValue = new Array();
        var trackValue = new Array();
        var singerValue = new Array();
        var arraySelected = 0;

        function getScores() {
            request1 = new XMLHttpRequest();
            request1.onreadystatechange = callback;
            request1.open("GET", "topSongs1990.xml", true);
            request1.send();
        }

        function callback() {
            if ((request1.readyState == 4) && (request1.status == 
        200)) {
                var parser;
                var xmlDoc;
                var scoreDataXML = request1.responseText;
                console.log(scoreDataXML);
                parser = new DOMParser();
                xmlDoc = 
                parser.parseFromString(scoreDataXML,"text/xml");
                var outputs = xmlDoc.getElementsByTagName("entry");
                console.log(outputs);


                var output = "<table>";
                output += "<tr><th>RATING</th><th>TRACK</th>
                <th>SINGER</th></tr>";


                if (arraySelected > 0; arraySelected < 10; ) {
                ratingValue[i].getElementsByTagName("rating")
               [0].childnodes[0].nodeValue + "</td><td>"
                + trackValue[i].getElementsByTagName("track")
               [0].childnodes[0].nodeValue + "</td><td>"
                + singerValue[i].getElementsByTagName("singer")
               [0].childnodes[0].nodeValue + "</td><td>";
                document.getElementsByTagName("entry").innerHTML;

               }else if (arraySelected > 10; arraySelected > 20; ){


               } else {

                for(i=0; i < outputs.length; i++) {

                    var ratingElement = 
                 outputs[i].getElementsByTagName("rating");
                    var trackElement = 
                 outputs[i].getElementsByTagName("track");
                    var singerElement = 
                 outputs[i].getElementsByTagName("singer");

                    var s1 = ratingElement[0].firstChild.nodeValue;
                    var i1 = trackElement[0].firstChild.nodeValue;
                    var d1 = singerElement[0].firstChild.nodeValue;
                    /*ratingValue[i] = s1;
                    trackValue[i] = i1;
                    singerValue[i] = d1;*/
                    var row = "<tr>";
                    row += "<td>" + s1 + "</td>";
                    row += "<td>" + i1 + "</td>";
                    row += "<td>" + d1 + "</td>";
                    row += "</tr>";
                    output += row;

                }

                /*console.log("The rating Array is " + ratingValue);
                console.log("The initials Array is " + trackValue);
                console.log("The dates Array is " + singerValue); */

                output += "</table>";
                document.getElementById("box1").innerHTML = output;

        }
    }


       </script>

    </body>
</html>

我希望我的功能每次点击吐出10个条目,如果我能够完成,我想知道如何减少这些值。 (我其实是javascript的新手,所以我道歉)

我不断收到错误,因为我无法正确形成正确的语法    ajaxXML6Modified.html:31未捕获的ReferenceError:getScores不是    定义

在HTMLButtonElement.onclick(ajaxXML6Modified.html:31)    onclick @ ajaxXML6Modified.html:31

建设性批评欢迎

0 个答案:

没有答案