如何每 3 秒自动刷新一次 Iframe,而不刷新整个页面。我用<meta http-equiv="refresh" content="1">
但它会显示整个页面刷新,并且每次都会将您带到页面顶部。我的 Iframe 指向一个文本文件来读取我放入的实时消息。有没有一种方法可以做到这一点,而无需刷新整个页面,仅刷新元素。我是 HTML 初学者,请彻底解释。我用谷歌搜索了很多,尝试了很多东西,但到目前为止没有任何效果,我在很多浏览器中尝试过。
到目前为止我的代码:
<!DOCTYPE html>
<html>
<head>
<link rel="shortcut icon" href="favicon.png" type="image/x-icon" />
<title>Chat</title>
<style>
body{
margin: 0px;
}
h1{
font-family: arial;
font-size: 100%;
}
iframe{
width: 900px;
height: 500px;
}
div.top{
background-color: rgba(2, 109, 8, 0.83);
height: 30px;
width: 100%;
}
</style>
</head>
<body>
<div class="top">
<img src="favicon.png" alt="favicon" height="31" width="31" >
<h1>Chat</h1>
</div>
<iframe src="text.txt" name="iframe_a"> />
</body>
</html>
您的 html 标签有问题。
(“iframe”标签格式错误)
在这里,您的代码已修复,并且您的答案已准备好运行:
<!DOCTYPE html>
<html>
<head>
<link rel="shortcut icon" href="favicon.png" type="image/x-icon" />
<title>Chat</title>
<style>
body {
margin: 0px;
}
h1 {
font-family: arial;
font-size: 100%;
}
iframe {
width: 900px;
height: 500px;
}
div.top {
background-color: rgba(2, 109, 8, 0.83);
height: 30px;
width: 100%;
}
</style>
</head>
<body>
<div class="top">
<img src="favicon.png" alt="favicon" height="31" width="31">
<h1>Chat</h1>
</div>
<iframe id="iframe" src="text.txt"></iframe>
<script>
window.setInterval(function() {
reloadIFrame()
}, 3000);
function reloadIFrame() {
console.log('reloading..');
document.getElementById('iframe').contentWindow.location.reload();
}
</script>
</body>
</html>
Regards
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)