获取按钮，显示XML文件中循环的下一次迭代

Getting button to show next iteration of loop from XML file

本文关键字：迭代 一次 循环 按钮 显示 XML 文件 获取      更新时间：2023-09-26

好的，这就是我要做的。我有一个XML文件，其中包含1000个分类广告为我的雇主，他希望能够有每个广告一次显示一个项目。我已经加载了XML文件，可以让它发布第一个广告，但我不知道如何让它去到循环中的下一个项目或倒退，这是我遇到的麻烦。下面是尝试前进的代码。

var x=xmlDoc.getElementsByTagName("item");
for (i=0;i<x.length;i++) {
    x= x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue;
    break;
}
document.getElementById("classified").innerHTML =x;  
function forward() {
    var text ="";
    var x=xmlDoc.getElementsByTagName("item");
    for (i=0;i<x.length;i++) {
        x= x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue;
        continue;
    }
    document.getElementById("classified").innerHTML = x;
}

那么我要做的就是点击一个按钮我可以获取下一个要发布的广告并删除第一个带有前进按钮的广告让后退按钮做相反的事情

您可以将所有广告的描述存储在数组中，并记住当前索引(显示的那个)。演示。

示例代码。我假设你在页面的某个地方有两个id为back/forward的按钮。

var fakeAds = Array.apply(null, new Array(1000)).map(function(_, i){
    return 'some random text ' + (i+1);
}), //replace with actual data
     idx = 0, //current index
     display = document.getElementById('display'), //where to show
     total = fakeAds.length; //total number of ads
function show() { //actually show ad at current idx.
    display.innerHTML = fakeAds[idx];        
}
document.getElementById('back').addEventListener('click', function(){
    --idx < 0 && (idx = total - 1); //decrement index and show
    show();
});
document.getElementById('forward').addEventListener('click', function(){
    idx = ++idx%total; //increment index and show
    show();
});
show(); //do show starting index.

以下是您需要的两个函数:DEMO

从您的代码中，这是如何首先从XML文件中提取所有item，然后通过循环从它们中获得每个description。这将生成一个存储在x var中的列表。

这会在XML文件中创建一个包含所有item元素的列表(这是下面的完整方法)

var connectXMLFile = new XMLHttpRequest();

定义打开哪个文件并发送请求

connectXmlFile.open("GET","PathToYourXMLFile.xml", false);
connectXMLFile.setRequestHeader("Content-Type", "text/xml");
connectXMLFile.send(null);

获取响应和所有item元素

var xmlDoc = connectXMLFile.responseXML;
var x=xmlDoc.getElementsByTagName("item");

表示您得到的广告列表

var adsList = [];

然后循环获取每个description并将其添加到列表

for (var i=0;i<x.length;i++) {
   adsList.push(x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue);
}

表示当前显示的广告

var adNumber = 0;
function forward() {
    if (adNumber >= adsList.length) adNumber = 0;
    document.getElementById("ad").innerHTML = adsList[adNumber];
    adNumber++;
}

function backwards() {
    if (adNumber == 0) adNumber = adsList.length;
    document.getElementById("ad").innerHTML = adsList[adNumber - 1];
    adNumber--;
}

这是基于您提供的代码，如果您需要任何解释，请随时询问。

相关文章：