刷新 javascript 代码答案

【问题标题】：To refresh a javascript code刷新 javascript 代码
【发布时间】：2016-05-10 05:31:33
【问题描述】：

很好，我有一个感谢这个站点的 javascript，它来自一个 XML 文档，其链接是：http://inlivefm.6te.net/NowOnAir.xml，javascript 必须删除作为艺术家姓名和歌曲 xml 文档的功能。我打算做的是添加javascript代码以自动刷新艺术家姓名和歌曲。

我尝试过但无法得到这个结果，下面我让javascript“尝试”刷新。

<script type="text/javascript">
  $(document).ready(function(){
          /*  Busca el archivo NowOnAir.xml */
          $.ajax({
            type: "GET",
            url: "/NowOnAir.xml",
            dataType: "xml",
            success: function(xml) {
                /*Buscar el tag <Event> e ir repitiendo el proceso hasta el final (bucle) */
                $(xml).find('Event').each(function(){
                    /*Tomar los valores de startTime*/
                    var startTime = $(this).attr('startTime');

                    /*Buscar el tag <Song> y repetir bucle*/
                    $(this).find('Song').each(function(){
                        /*Tomar los valores de title*/
                        var title = $(this).attr('title');
                        var artist;

                        /*Buscar el tag <Artist> y repetir bucle*/
                        $(this).find('Artist').each(function(){
                            /*Tomar los valores de name*/
                            artist = $(this).attr('name');
                        });

                        /*Buscar el tag Expire y repetir bucle*/
                        $(this).find('Expire').each(function(){
                            var time = $(this).attr('Time');
                            $('.cancion').append("<p>"+artist+" - "+title+"</p>");
                            setInterval(function(){$('.cancion');}, 5000);
                        });
                    });
                });
            }
          });
        });
</script>
</head>
<body>
<div class="cancion"></div>
</body>
</html>

我一定是犯了错误，所以我来寻求您的帮助。

既然已经非常感谢你了。

【问题讨论】：

标签： javascript jquery xml refresh setinterval

【解决方案1】：

可能导致错误的主要原因是closing braces & brackets 在一些地方丢失。

使用setInterval 函数自动刷新您的内容。

<script>

$(document).ready(function(){
get_info();
setInterval(function(){ get_info(); }, 20000);

function get_info(){

        $.ajax({
            type: "GET",
            url: "NowOnAir.xml",
            dataType: "xml",
            success: function(xml) {                     
                  $(xml).find('Event').each(function(){                                  
                  $(this).find('Song').each(function(){                
                  var title = $(this).attr('title');
                  var artist;                

                  $(this).find('Artist').each(function(){                    
                    artist = $(this).attr('name');
                  });                

                  $(this).find('Expire').each(function(){                    
                  $('.cancion').append("<p>"+artist+" - "+title+"</p>");
                });
              });
            });
          }
       });
}
});

</script>

如果您需要在每次 $.ajax 调用时替换 <div> 的内容，那么使用.html() 方法。

$('#content-wr').html('<div class="new-lines"><div><a>' + val.id + '&nbsp;&nbsp;&nbsp;' + val.joke + '</a></div></div>');

并检查这个例子：

setInterval(function(){    
  $.ajax ({
    url: 'http://api.icndb.com/jokes/random',
    method: 'GET',
    beforeSend: function(){
      $('#content-wr').children().fadeOut(1500);
    },
    success: function(data){
      var val = data.value
      $('#content-wr').append('<div class="new-lines"><div><a>' + val.id + '&nbsp;&nbsp;&nbsp;' + val.joke + '</a></div></div>');
    }
    });    
},5000);

.new-lines > div{
  width: 500px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="content-wr"></div>

您的ajax 将被调用，内容每 5 秒更新/刷新一次。

或者将您的 ajax 调用放入 get_info() 函数中。

【讨论】：

我按照你说的再试了一次，但我无法得到我想要的，我可以按照你的说法更改 javascript，我将不胜感激。谢谢！
@AndréSantos 请检查我的答案提供的code snippet。
我放了你提供的代码，我知道你的好例子的每一步，但我仍然无法刷新，没有其他方法可以更简单地刷新吗？
我编辑了帖子，基于我缺少的代码来实现刷新，因为我使用 setInterval (function () { all content消失
@AndréSantos，另一种方法是将<meta http-equiv="refresh" content="20"> 放入<head>。此方法将重新加载整个页面，而不仅仅是某个元素内的内容。