- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
我在 blogspot 上使用 Javascript 小部件。它包括一个带有一些 javascript 的 div,这些 javascript 从服务器获取一些“非静态”字符串并将它们打印在页面上。直到这里一切正常,问题是我想每隔几秒更新一次这个 div 的执行,以便更新字符串,而不刷新整个页面,而只是刷新特定的小部件 (div)。我添加了另一个试图刷新特定 div 的脚本,但我没有运气。请看下面的代码
<div id="info">
<b>Song:</b>
<script type="text/javascript" src="xxxx">
You appear to have javascript turned off.
</script>
<br />
<b>Listeners:</b>
<script type="text/javascript" src="xxxx">
You appear to have javascript turned off.
</script>
<br />
<b>Server Status:</b>
<img src="xxxxx.gif" alt="Stream status" width="17" height="17" align="absmiddle" />
</div>
刷新脚本:
<script type="text/javascript">
window.onload = startInterval;
function startInterval()
{
setInterval("startTime();",5000);
}
function startTime()
{
document.getElementById('info').innerHTML = ??? // reload div
}
</script>
另外也可以使用类似这样的方法,但这种方法会重新加载整个页面而不是特定的 div。
<script>
setInterval(function() {
parent.location.reload(true);
}, 5000);
</script>
最佳答案
最后更新
我尝试使用 Ajax 和创建的元素。使用此技术,加载脚本的包含但 document.write()
不起作用。因为这个write()
需要refresh page()!!
只是从函数返回一个值不会以任何方式将该值放入 HTML 元素中。可以使用 document.write
(不推荐),或者通过其 id 访问元素并通过 .innerHTML=...
解释。
如果您要在页面上显示它,首先创建一个带有 id“message”的元素(您可以写任何您想要的内容,但请记住,id 在页面上必须是唯一的),例如
<div id="message"></div>
然后使用
document.getElementById("message").innerHTML = "New title";
或者如果您使用的是 jQuery:
$("#message").html("New title");
或者如果您使用的是支持控制台的浏览器(Firefox、Chrome 等)
console.log("New title");
代替
document.write("New title");
THEN document.write
仅用于页面加载时间。
您必须更改脚本并替换 document.write()
我将我的代码与 createElement
放在一起,您可以在评论中看到我的作品。
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body onload="JavaScript:timedRefresh(5000);">
<div id="info">
<b>Song:</b>
<script type="text/javascript" src="http://shoutcast.mixstream.net/js/song/uk23-free:5106">You appear to have javascript turned off.</script>
<br />
<b>Listeners:</b>
<script type="text/javascript" src="http://shoutcast.mixstream.net/js/listeners/uk23-free:5106">
You appear to have javascript turned off.
</script>
<br />
<b>Server Status:</b>
<img src="http://shoutcast.mixstream.net/status/uk23-free:5106.gif" alt="Stream status" width="17" height="17" align="absmiddle" />
</div>
<script type="text/javascript">
function timedRefresh(timeoutPeriod) {
var myVar=setInterval(function(){myTimer()},timeoutPeriod);
function myTimer()
{
document.getElementById("info").innerHTML="";
var b=document.createElement('B');
b.appendChild( document.createTextNode("Song") );
document.getElementById("info").appendChild(b);
// span.innerHTML="";
// span.appendChild( document.createTextNode("hello") );
// document.getElementById('myspan').innerHTML = 'newtext';
var src1 = 'http://shoutcast.mixstream.net/js/song/uk23-free:5106',
script1 = document.createElement('SCRIPT');
script1.type="text/javascript";
script1.src = src1;
document.getElementById("info").appendChild(script1);
var br= document.createElement('BR');
document.getElementById("info").appendChild(br);
document.getElementById("info").appendChild(br);
var b=document.createElement('B');
b.appendChild( document.createTextNode("Listeners") );
document.getElementById("info").appendChild(b);
var src2 = 'http://shoutcast.mixstream.net/js/listeners/uk23-free:5106',
script2 = document.createElement('SCRIPT');
script2.type="text/javascript";
script2.src = src2;
document.getElementById("info").appendChild(script2);
document.getElementById("info").appendChild(br);
var b=document.createElement('B');
b.appendChild( document.createTextNode("Server Status") );
document.getElementById("info").appendChild(b);
var src3 = 'http://shoutcast.mixstream.net/js/song/uk23-free:5106',
script3 = document.createElement('IMG');
script3.src = src3;
script3.alt="Stream status";
script3.width="17";
script3.height="17";
script3.align="absmiddle";
document.getElementById("info").appendChild(script3);
//
// document.body.appendChild(script);
//
// document.body.info.appendChild(b);
// document.getElementsByTagName('b')[1].appendChild( document.createTextNode("Listeners") );
// document.body.info.appendChild(script2);
// var br= document.createElement('BR');
//
// document.body.info.appendChild(br);
}
// // create an object of the head element of current page
// var hdEl = document.getElementsByTagName("song");
//
// //check for previously appended child
// //(it ensures that each time the button is pressed it
// // removes the previously loaded script element)
// if (hdEl.childNodes.length > 1) {
// hdEl.removeChild(hdEl.lastChild);
// }
//
// // Now add this new element to the head tag
//
//
// //Create a 'script' element
// var scrptE = document.createElement("script");
//
// // Set it's 'type' attribute
// scrptE.setAttribute("type", "text/javascript");
//
// // Set it's 'language' attribute
// scrptE.setAttribute("language", "JavaScript");
//
// // Set it's 'src' attribute
// scrptE.setAttribute("src", "http://shoutcast.mixstream.net/js/song/uk23-free:5106");
//
// // Now add this new element to the head tag
// hdEl.appendChild(scrptE);
// // document.getElementsByTagName("song").appendChild(scrptE);
// //This is a old:
// setTimeout("alert("ojk");",timeoutPeriod);
// // This function!!!
// setTimeout("document.getElementById('info').innerHTML = document.getElementById('info').innerHTML;",timeoutPeriod);
// var oHead = document.getElementsByTagName('HEAD').item(0);
// var oScript= document.createElement("script");
// oScript.type = "text/javascript";
// oScript.src="other.js";
// oHead.appendChild( oScript);
}
</script>
</body>
</html>
更新:
然后....
我更改了您的站点,现在可以正常运行了!!!在我的电脑上,这个网站每 5 秒刷新一次!!!你总是有两个特定的错误。
这对你有用,但你有特定的错误。资源解释为脚本但使用 MIME 类型文本/html 传输:“http://xxxx”
。关于第 13 句和第 18 句。
http://xxxx
这个错误是我在工具的 chrome(检查元素)中发现的。
解决方案在 Stackoverflow 上或者更喜欢 blog .
我的软件是 Kubuntu (KDE + Ubuntu),我不知道要更改值的注册表。
解决方案:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body onload="JavaScript:timedRefresh(5000);">
<div id="info">
<b>Song:</b>
<script type="text/javascript" src="xxxx">You appear to have javascript turned off.</script>
<br />
<b>Listeners:</b>
<script type="text/javascript" src="xxxx">
You appear to have javascript turned off.
</script>
<br />
<b>Server Status:</b>
<img src="xxxx.gif" alt="Stream status" width="17" height="17" align="absmiddle" />
</div>
<script type="text/javascript">
function timedRefresh(timeoutPeriod) {
//This is a old:
//setTimeout("location.reload(true);",timeoutPeriod);
// This function!!!
setTimeout("document.getElementById('info').innerHTML = document.getElementById('info').innerHTML;",timeoutPeriod);
}
</script>
</body>
</html>
或其他解决方案:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body >
<div id="info">
<b>Song:</b>
<script type="text/javascript" src="xxxx">You appear to have javascript turned off.</script>
<br />
<b>Listeners:</b>
<script type="text/javascript" src="xxxxx">
You appear to have javascript turned off.
</script>
<br />
<b>Server Status:</b>
<img src="xxxxx.gif" alt="Stream status" width="17" height="17" align="absmiddle" />
</div>
<script type="text/javascript">
// function timedRefresh(timeoutPeriod) {
// setTimeout("document.getElementById('info').innerHTML = document.getElementById('info').innerHTML;",timeoutPeriod);
// document.getElementById("info").innerHTML=document.getElementById("info").innerHTML
// }
window.setInterval("refreshDiv()", 5000);
function refreshDiv(){
document.getElementById("info").innerHTML = document.getElementById("info").innerHTML;
}
</script>
</body>
</html>
这是一个旧站点,但不会刷新站点。
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="info">
<b>Song:</b>
<script type="text/javascript" src="xxxx">You appear to have javascript turned off.</script>
<br />
<b>Listeners:</b>
<script type="text/javascript" src="xxxx">
You appear to have javascript turned off.
</script>
<br />
<b>Server Status:</b>
<img src="xxxx.gif" alt="Stream status" width="17" height="17" align="absmiddle" />
</div>
<script type="text/javascript">
setInterval(function(){
document.getElementById('info').innerHTML = document.getElementById('info').innerHTML;
}, 5000);
</script>
</body>
</html>
关于javascript - 自动刷新特定的 div 博主 javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16630569/
请问博主有没有elseif语句? 我所看到的只是 if 和 else 但没有 elseif。 如果没有任何 elseif 语句,我如何为 if 语句提供多个条件? 例如在这种情况下,我有 3 个作者
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于 Stack Overflow 来说是偏离主题的,
老实说,我不是程序员。我从教程中获得了原始代码,只是调整了颜色和字体,但是当我将鼠标悬停在主菜单项上并尝试单击子菜单时,它消失了。我从其他线程中看到这是一个常见问题,但我似乎找不到像我这样的代码以前问
我在使用下拉菜单时遇到问题 - 必须承认,我是编码新手。当鼠标悬停在第一个下拉菜单选项框内的文本正下方时,下拉菜单会消失,因此这绝对是一个间距问题。 我已经查看了 Stack overflow 和其他
你好我想知道如何让我的搜索栏在右边而不是在中间 下面的搜索栏完整代码,谢谢 www.codepen.io/anon/pen/zKakyJ www.gamesparadis.blogspot.com 最
调整大小后图像模糊问题您可以在标题下的三个主要图像中看到这一点这是博客链接的预览: Click Here 我希望你能帮助我,谢谢你...... 最佳答案 我找到了一个问题的解决方案: 如果您查看 Go
我正在为我的博客使用 Blogger SOHO 主题: https://www.firozemistry.com 在“设置”中,如果我将“灯箱”选项设置为"is",并点击一张照片,它会在正常的全屏覆盖
我正在尝试使用 java api 添加带有图像的帖子。正如文档所描述的( https://developers.google.com/blogger/docs/3.0/reference/posts
关闭。此题需要details or clarity 。目前不接受答案。 想要改进这个问题吗?通过 editing this post 添加详细信息并澄清问题. 已关闭 9 年前。 Improve th
我在 blogspot 上使用 Javascript 小部件。它包括一个带有一些 javascript 的 div,这些 javascript 从服务器获取一些“非静态”字符串并将它们打印在页面上。直
如您所见,我博客的标题 https://blog.cryformeqq.icu目前有标题的阴影,加上背景颜色顶部有这个奇怪的渐变(应该与导航栏下的浅灰色相同) 有人有什么想法吗?我尝试了很多我在网上找
我正在学习从头开始创建模板,但我遇到了下一个问题,就像我们在 html 中知道的那样,我们创建了包含我们的设计代码的 *.html 文件,所以我创建了这个模板 http://tesety.blogsp
有谁知道任何仅自动调整帖子特色图片大小的代码? 这是我发现的自动调整博客文章中所有图片大小的代码: .post-body img { width: 180px!important; h
之前通过调用 gdata.blogger.client.add_post() 获得了帖子 ID... post = client.add_post(...) post_id = post.get_po
我的问题出在博客模板设计上当我添加此标签时 这条错误信息出现在我身上 有什么解决办法吗? 最佳答案 请务必通过将属性 b:layoutsVersion='3' 添加到 html 标记来定义布局版本,如
我是一名优秀的程序员,十分优秀!