1

我是 JavaScript 新手,因此将不胜感激任何帮助。

我目前正在设计一个将获取 redmine xml 数据的网站。xml 数据类似于:http ://www.redmine.org/projects/redmine/issues.xml?set_filter=100 。它也可以在 json 中使用。

我需要做的是获取问题数据,对其进行过滤并将其放入两组三个表中。第一组表应该有一个表列出有关 done_ratio=0 的问题的所有详细信息,第二个表为 100 > done_ratio > 0,第三个表为 done_ratio=100。第二组三个表应包含根据三个状态名称过滤的所有问题详细信息,即状态名称=“新”等的一个表。

这必须仅在 JavaScript 中完成,如果绝对需要,可以使用 jQuery。无法使用 Redmine 插件。

至今,

xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "http://www.redmine.org/projects/redmine/issues.xml?set_filter=100", true);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
x = xmlDoc.getElementsByTagName("issue");
for (i = 0; i <x.length; i++) {
table += "<tr><td>";
table +=  x[i].getElementsByTagName("id")[0].childNodes[0].nodeValue;
table += "</td><td>";
document.getElementById("demo").innerHTML = table;

我不知道如何遍历所有数据,并将所有问题数据放入一个数组中,特别是对于具有两部分的元素,例如id="", name="",以及对于子元素,例如<id="" name=""><value></value></>,然后过滤以放入不同的表中。

最终,在所有这些之后,另一个目标是对数据进行一些计算并生成图表,例如燃尽图和速度图。

任何帮助,因为我已经研究了一段时间并坚持如何去做。

4

1 回答 1

0

做这样的事情。

function getData() {
    xmlhttp = new XMLHttpRequest();
    //request below doesn't really work because of CORS problem
    xmlhttp.open("GET", "http://www.redmine.org/projects/redmine/issues.xml?set_filter=100", true);
    //XMLHttpRequest is asynchronous so response is not available immediately
    xmlhttp.onreadystatechange = function () {
        if (this.readyState == 4 && this.status == 200) {//loaded successfully 
            var xmlDoc = xmlhttp.responseXML;
            //create tables
            var done0 = document.createElement('table');
            var doneSome = document.createElement('table');
            var done100 = document.createElement('table');
            var issues = xmlDoc.getElementsByTagName('issue');
            //HTMLCollection received
            for (var i = 0, issue; issue = issues[i]; ++i) {
                var done = +issue.getElementsByTagName('done_ratio')[0].textContent;
                if (done >= 100)
                    addTableRow(done100, issue);//see helper function below
                else if(done>0)
                    addTableRow(doneSome, issue);
                else
                    addTableRow(done0, issue);
            }
            //everything done. Show results.
            document.getElementById('demo').appendChild(done0);
            document.getElementById('demo').appendChild(doneSome);
            document.getElementById('demo').appendChild(done100);
        }
    }
    xmlhttp.send();//send request 
}

//helper function to work with tables
function addTableRow(tblObj, dataObj) {
    var row = tblObj.insertRow(-1);//create new row and add to the bottom
    //add table cell and put content from xml element <id>
    row.insertCell(-1).innerHTML = dataObj.getElementsByTagName('id')[0].textContent;
    row.insertCell(-1).innerHTML = dataObj.getElementsByTagName('done_ratio')[0].textContent;
    //use content from attribute
    row.insertCell(-1).innerHTML = dataObj.getElementsByTagName('priority')[0].getAttribute('name');
}

getData();
于 2016-09-03T20:33:03.170 回答