如何刷新 DIV 内容？
Posted
技术标签:
【中文标题】如何刷新 DIV 内容？【英文标题】：How do I refresh a DIV content? 【发布时间】：2016-02-21 11:07:03 【问题描述】：<div id='here'></div>
我正在尝试刷新一堆 div 中的某个 div。除了在 XMLHttpRequest 的帮助下发送的许多变量之外，div 内容基本上是由 php 以及来自 mysql 数据库的数据生成的。
这个想法是重新加载/刷新 div 本身，而不是加载 php 文件或用.text 或.html 覆盖它。在这种情况下，我不能使用.load('file.php')
我尝试过的：
<script type='text/javascript'>
function updateDiv()
document.getElementById("here").innerHTML = document.getElementById("here").innerHTML ;
</script>
和（每 3 秒刷新一次）：
$(document).ready(function ()
setInterval(function ()
$('#here').load('#here'));
, 3000);
);
理想情况下，我需要类似：
function reloadDIV () document.getElementById("here").innerHTML.reload
function reloadDIV () $('#here').load(self)
以便我可以在 onClick 中使用它：
<a onclick='reloadDIV ();'>reload div</a>
【问题讨论】：
您的代码目前无效（额外关闭)，但是为什么您的网址不是加载中的真实网址？
这不是 http 请求的工作方式。如果你想重新计算服务器上的东西，你需要发出一个 http 请求。要将内容加载到 div 中而不刷新页面，您需要发出 ajax 请求。 "I cannot use .load('file.php')" 是什么意思？
尝试$(this).html("<Value>")更新div的内部html。要覆盖 html 内容，请将 html 副本保留为 display:none 并将该 div 中的内容复制到“here” div
只需将 self 替换为提供刷新内容的脚本的 URL。
您应该使用 ajax 来刷新 DIV 内容，具体取决于 PHP 脚本返回的新数据。关于您的代码，您似乎误解了它。为什么你不能只使用$('#here').load('pathToPHP', dataOBJToPass or use string for GET mthod);？？？ jQuery load()
【参考方案1】：
您可以使用 jQuery 使用简单的$.get 方法来实现此目的。 .html 像 innerHtml 一样工作并替换您的 div 的内容。
$.get("/YourUrl", ,
function (returnedHtml)
$("#here").html(returnedHtml);
);
并使用 javascript setInterval 方法调用它。
【讨论】：
他已经在使用 jQuery 和 $.get throughload (api.jquery.com/load)
“加载”的问题是它不允许您控制/操作返回的 html。
如果不需要参数，就不要放$.get("/YourUrl", function(returnedHtml) ... );就够了。【参考方案2】：
要重新加载页面的一部分，您可以使用 jquerys load 与当前 url 并指定您需要的片段，这将与调用 load 的元素相同，在本例中为 #here：
function updateDiv()
$( "#here" ).load(window.location.href + " #here" );
+ " #here"
这个函数可以在一个区间内调用，也可以附加到点击事件上
【讨论】：
哇。 jQuery 从未停止给我留下深刻印象。 我已经对此进行了测试，这正是我所需要的。谢谢@史蒂夫 这会重新加载特定的 div，但它也会在 div 内部创建具有相同 id 的 div。如何摆脱那个div？刷新前<div id="here"> </div>刷新后<div id="here"> <div id="here"></div> </div>
我也需要这个，但删除了重复的 div。有人知道怎么做吗？
function updateDiv() $( "#here" ).load(location.href + " #here" ); 也为我工作而无需复制 div【参考方案3】：
对于 div 刷新而不在你的内部创建具有相同 id 的 div，你应该在你的函数中使用它
$("#yourDiv").load(" #yourDiv > *");
【讨论】：
在数据变化的意义上刷新。不重新渲染 div 这很棒。谢谢！ 这是超级解决方案。【参考方案4】：完整的工作代码如下所示：
<script>
$(document).ready(function()
setInterval(function()
$("#here").load(window.location.href + " #here" );
, 3000);
);
</script>
<div id="here">dynamic content ?</div>
自重新加载 div 容器每 3 秒刷新一次。
【讨论】：
【参考方案5】：如果您打算重新加载<div>，这个$("#yourDiv").load(" #yourDiv > *"); 是最好的
确保使用id 而不是class。另外，如果您还没有粘贴 <script src="https://code.jquery.com/jquery-3.5.1.js"></script> 到 html 文件的 <head> 部分，请记住。反之则不行。
【讨论】：
以上是关于如何刷新 DIV 内容？的主要内容，如果未能解决你的问题，请参考以下文章