利用js实现无刷新按时取数据,其实就是利用js的ajax方式,从后台获取数据,然后,更新页面的局部内容。本文就为你演示实现体例
打开vscode,建立一个测试html页面,用于演示js实现无刷新按时取数据,也就是ajax的局部刷新实现体例
在测试页面的同级,添加一个jquery的源文件,目标是为了js操作的便当性,然后,将jquery源文件引入到测试页面中
在测试页面中,添加两个div,第一个div的内容,后续将按时刷新。第二为div的内容将一向固心猿意马不变,目标是演示界面无刷新取数更新局部
在测试页面的底部,添加js代码,先写一个js方式,发送ajax请求,从后台获取数据,然后更新到第一个div的位置。此处仅做演示,所以,这个ajax方式仅仅只是大要布局,因为没有做后台办事,运行不起来
上一步已经演示了ajax从后台获取数据,然后更新的架子。此刻再加别的一个方式,在这个方式中,将当前时候更新到第一个div
因为要按时执行,就需要利用到js的setInterval方式,按照指心猿意马距离的时候挪用上一步的方式了。需要注重的是setInterval方式的时候距离单元是毫秒
在浏览器中打开测试页面,就能看到页面没有刷新,可是,第一个div的内容却在第6步指心猿意马的时候距离中刷新了
0 篇文章
如果觉得我的文章对您有用,请随意打赏。你的支持将鼓励我继续创作!