我有一个基本的 html 文件，它附加到一个 java 程序。这个java程序在页面刷新时更新部分HTML文件的内容。我只想在每个时间间隔后刷新页面的那部分。我可以将要刷新的部分放在 .a 中div，但我不确定如何仅刷新div. 任何帮助，将不胜感激。谢谢你。
刷新部分页面 (div)
IT技术
javascript
html
refresh
2021-01-19 07:48:16
5个回答
为此使用 Ajax。
构建一个函数，它将通过 ajax 获取当前页面，但不是整个页面，只是来自服务器的有问题的 div。然后数据将（再次通过 jQuery）放在同一个有问题的 div 中，并用新内容替换旧内容。
相关功能：
例如
$('#thisdiv').load(document.URL + ' #thisdiv');
请注意，加载会自动替换内容。确保在 id 选择器之前包含一个空格。
假设您的 html 文件中有 2 个 div。
<div id="div1">some text</div>
<div id="div2">some other text</div>
java程序本身无法更新html文件的内容，因为html与客户端相关，而java与后端相关。
但是，您可以在服务器（后端）和客户端之间进行通信。
我们正在谈论的是 AJAX，您可以使用 JavaScript 实现它，我建议使用 jQuery，它是一个常见的 JavaScript 库。
假设您想每隔固定间隔刷新页面，那么您可以使用间隔函数每隔 x 次重复相同的操作。
setInterval(function()
{
alert("hi");
}, 30000);
你也可以这样做：
setTimeout(foo, 30000);
其中 foo 是一个函数。
您可以执行 AJAX 请求而不是 alert("hi")，该请求向服务器发送请求并接收一些信息（例如新文本），您可以使用这些信息加载到 div 中。
一个经典的 AJAX 看起来像这样：
var fetch = true;
var url = 'someurl.java';
$.ajax(
{
// Post the variable fetch to url.
type : 'post',
url : url,
dataType : 'json', // expected returned data format.
data :
{
'fetch' : fetch // You might want to indicate what you're requesting.
},
success : function(data)
{
// This happens AFTER the backend has returned an JSON array (or other object type)
var res1, res2;
for(var i = 0; i < data.length; i++)
{
// Parse through the JSON array which was returned.
// A proper error handling should be added here (check if
// everything went successful or not)
res1 = data[i].res1;
res2 = data[i].res2;
// Do something with the returned data
$('#div1').html(res1);
}
},
complete : function(data)
{
// do something, not critical.
}
});
后端能够接收 POST'ed 数据并能够返回信息的数据对象，例如（并且非常优选）JSON，有很多教程介绍如何这样做，来自 Google 的 GSON 是我所知道的前阵子用过，你可以看看。
我对 Java POST 接收和 JSON 返回不专业，所以我不会给你一个例子，但我希望这是一个不错的开始。
您需要在客户端执行此操作，例如使用 jQuery。
假设您想将 HTML 检索到带有 ID 的 div 中mydiv：
<h1>My page</h1>
<div id="mydiv">
<h2>This div is updated</h2>
</div>
您可以使用 jQuery 更新页面的这一部分，如下所示：
$.get('/api/mydiv', function(data) {
$('#mydiv').html(data);
});
在服务器端，您需要为传入的请求实现处理程序，/api/mydiv并返回进入 mydiv 的 HTML 片段。
请参阅我为您制作的这个 Fiddle，这是一个使用 jQuery get 和 JSON 响应数据的有趣示例：http : //jsfiddle.net/t35F9/1/
使用fetch和innerHTML加载 div 内容
$.ajax(), $.get(), $.post(), $.load()jQuery 内部发送XML HTTP请求的功能。其中，load()仅专用于特定的DOM Element。请参阅jQuery Ajax 文档。有关这些的详细 QA 在这里。