将元素推送到HTML ID时更新live JavaScript数组

作为一名JavaScript新手，我面临着一个小小的困境。让我解释一下剧本：

我实现了一个JavaScript函数

rss（）

，它从internet rss新闻提要中提取新闻标题并将其保存到一个数组

newsArray[]

函数

headlinesInsert（）

应该将数组中的每个项推送到HTML ID

#headlineInsert

，类似于它的显示方式

但是，链接示例的

textlist

变量（应替换为my local

newsArray[]

）由于某些原因似乎不“兼容”，因为替换时HTML端不显示任何内容

想法是，

rss（）

函数每10分钟更新一次全局

newsArray[]

新标题，而

headlinesInsert（）

不断将此数据推送到HTML ID（如链接示例所示）

由于我对JavaScript的了解有限，我希望有人能帮助我正确设置以下代码，并将想法付诸实施

// Push RSS Headlines into HTML ID
var newsArray = [];
var listTicker = function headlinesInsert(options) {
    var defaults = {
        list: [],
        startIndex:0,
        interval: 8 * 1000,
    }

    var options = $.extend(defaults, options);
    var listTickerInner = function headlinesInsert(index) {
        if (options.list.length == 0) return;
        if (!index || index < 0 || index > options.list.length) index = 0;
        var value = options.list[index];
        options.trickerPanel.fadeOut(function headlinesInsert() {
            $(this).html(value).fadeIn();
        });
        var nextIndex = (index + 1) % options.list.length;

        setTimeout(function headlinesInsert() {
            listTickerInner(nextIndex);
        }, options.interval);
    };
    listTickerInner(options.startIndex);
}

// The following line should hold the values of newsArray[]
var textlist = new Array("News Headline 1", "News Headline 2", "News Headline 3", "News Headline 4");

$(function headlinesInsert() {
    listTicker({
        list: textlist ,
        startIndex:0,
        trickerPanel: $('#headlineInsert'),
        interval: 8 * 1000,
    });
});

$(function slow(){
    // Parse News Headlines into array
    function rss() {
        $.getJSON("https://api.rss2json.com/v1/api.json?rss_url=https%3A%2F%2Fwww.stuff.co.nz%2Frss", function(data) {
            newsArray = [];
            for (var i = 0; i < data.items.length; i++){
                newsArray[i] = (data.items[i].title);
            }
            console.log(newsArray);
    })}

    // Refresh functions ever 10 minutes
    rss()
    setInterval(function slow() {
        rss();
    }, 600000); // 10 Minute refresh time
});

//将RSS标题推送到HTML ID中
var newsArray=[]；
var listTicker=功能标题插入（选项）{
var默认值={
名单：[]，
startIndex:0，
间隔：8*1000，
}
var options=$.extend（默认值，选项）；
var listTickerInner=函数标题行插入（索引）{
如果（options.list.length==0）返回；
如果（！index | | index<0 | | index>options.list.length）index=0；
var值=选项。列表[索引]；
选项.trickerPanel.fadeOut（函数headlinesInsert（）{
$（this.html（value.fadeIn（））；
});
var nextIndex=（索引+1）%options.list.length；
setTimeout（函数headlinesInsert（）{
listTickerInner（nextIndex）；
}，选项。间隔）；
};
listTickerInner（options.startIndex）；
}
//下一行应包含newsArray[]的值
var textlist=新数组（“新闻标题1”、“新闻标题2”、“新闻标题3”、“新闻标题4”）；
$（函数标题行插入（）{
上市公司({
列表：textlist，
startIndex:0，
trickerPanel:$（'标题插入'），
间隔：8*1000，
});
});
$（函数慢（）{
//将新闻标题解析为数组
函数rss（）{
$.getJSON（“https://api.rss2json.com/v1/api.json?rss_url=https%3A%2F%2Fwww.stuff.co.nz%2Frss，函数（数据）{
新闻数组=[]；
对于（变量i=0；i

检查以下代码。加载rss提要后，您需要初始化

listTicker

var listTicker=函数（选项）{
var默认值={
名单：[]，
startIndex:0，
间隔：3*1000，
}
var options=$.extend（默认值，选项）；
var listTickerInner=函数（索引）{
如果（options.list.length==0）返回；
如果（！index | | index<0 | | index>options.list.length）index=0；
var值=选项。列表[索引]；
options.trickerPanel.fadeOut（函数（）{
$（this.html（value.fadeIn（））；
});
var nextIndex=（索引+1）%options.list.length；
setTimeout（函数（）{
listTickerInner（nextIndex）；
}，选项。间隔）；
};
listTickerInner（options.startIndex）；
}
var textlist=新数组（“news1”、“news2”、“news3”）；
$（函数（）{
函数rss（）{
$.getJSON（“https://api.rss2json.com/v1/api.json?rss_url=https%3A%2F%2Fwww.stuff.co.nz%2Frss，函数（数据）{
新闻数组=[]；
对于（变量i=0；i

也许这个（）可以帮助您。我喜欢这种方法，因为它可以很好地遍历数组数据。但正如我在文章中提到的，数组每10分钟接收一次新数据，当它接收到新数据时，显示的间隔和文本的行为异常。显示的文本在新数据进入之前在数组位置显示文本，但同时启动函数的新实例以将新数据推出，这会使标题跳转（ea实例希望显示）并与定义的间隔不同步-尤其是当数组数据已翻转2+次时。这些“旧的例子”需要处理掉，你有没有办法解决我在评论中提出的问题？基本上，问题在于函数的新实例，每次函数启动时，它似乎会填充一个新数组，而不是更新当前数组。我知道这几乎不明显，但在几个小时的过程中（请记住，新查询每10分钟处理一次，并应将其数据加载到数组中），可以非常明显地看到，时间完全关闭了。它的停止时间超过指定的时间，跳跃元素的顺序等。任何解决方案都非常感谢。干杯