仅使用常规Javascript刷新页面中的一个<div>

Question

如果我没有从服务器获取任何信息,但我想每N秒重新加载/刷新一次div,我该怎么做？

javascript新手:我尝试过类似的东西

 <script type = 'text/javascript'>
    function refresh(){
        setTimeout(window.location.reload(), 10000);
    }

    </script>

    <div id='target' onLoad='refresh()'>
<?    
var =grab some rapidly changing content from the web    
print var
  ?>  
    </div>
    <div>
    some stuff that doesn't get refreshed
    </div>

我不清楚,如果我没有从服务器获取新信息,我需要AJAX ...所以现在我想知道如何让它在javascript中工作

编辑:我不喜欢使用库进行这个基本操作,所以理想情况下我不会使用jquery,原型等.编辑II:不知道为什么人们说div不变...它的内容是动态的,它被抓住了从网上说起来......并且每当它去抓东西的东西已经改变了......一个例子可能是抓住来自Twitter的搜索结果,变化非常迅速......

Answer 1

是的,你确实需要Ajax,因为根据定义,这就是Ajax.特别是如果你想从其他网站获取内容.

我知道你说你想使用普通的javascript,但看看这个,也许你会喜欢这个.看看这个很棒的jQuery插件. https://github.com/jamespadolsey/jQuery-Plugins/tree/master/cross-domain-ajax/

这很简单,用它让你执行Ajax唱jQuery的一个很大的区别的:你可以抓住从内容上任何地方(例如,在其他网站上的内容来自).你可以像在自己的服务器上一样使用相同的jQuery.load()方法或.ajax()方法,除了你可以从任何地方获取内容!

只需将插件脚本添加到页面(在jQuery之后),然后使用此处所述的.load()方法.

所以在你的情况下,你可以做这样的事情:

$('div#target').load('http://somewhere.com #newContent');

这将从somewhere.com获得#newContent并将其放在您网站上的#target中.

你可以使用javascript的setInterval做这样的事情:

setInterval( function() {
    $('div#target').load('http://somewhere.com #newContent');
}, 5000); //repeat function every 5000 milliseconds

这将每5000毫秒(也称为5秒)重复函数(){}内的任何内容.

您还可以从自己的网站获取内容:

$('div#target').load('http://yoursite.com/some-page #someContent');

这将使#someContent和无论是在它的内部,从http://yoursite.com/some-page到#target上http://yoursite.com/whatever-the-current-page-is

总而言之,这是一种加载内容的超级简单方法.jQuery的大小只有31kb(缩小),我相信它是值得的.没有必要重新发明轮子,当jQuery可以做你想要的,并有效地,除非你试图进出javascript.如果你只是想让你的网站工作(最终结果是重要的),那么就给出一个超级简单的方法,我只是试一试.