html - Auto refresh a specific div blogger javascript -
i use javascript widget on blogspot. include div javascripts "non-statical" strings server , print them on page. until here works fine, problem update execution of div every few seconds in order have updated strings, without refreshing whole page, specific widget (div). have added script tries refresh specific div, had no luck. please see code below
<div id="info"> <b>song:</b> <script type="text/javascript" src="xxxx"> appear have javascript turned off. </script> <br /> <b>listeners:</b> <script type="text/javascript" src="xxxx"> appear 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 refreshing:
<script type="text/javascript"> window.onload = startinterval; function startinterval() { setinterval("starttime();",5000); } function starttime() { document.getelementbyid('info').innerhtml = ??? // reload div } </script> additionally used, method reload whole page , not specific div.
<script> setinterval(function() { parent.location.reload(true); }, 5000); </script>
last update
i try ajax , created element. technique, load contains of scripts document.write() not function. because write() need refresh page()!!
just returning value function not place value html element in way. 1 either use document.write (not recommended), or access element via id , write desired element content via .innerhtml=…
explain.
if displaying on page, first create element id "message" (you can write want, remember, id's have unique on page) like
<div id="message"></div> and use
document.getelementbyid("message").innerhtml = "new title"; or if using jquery:
$("#message").html("new title"); or if using console enabled browser (firefox, chrome etc.)
console.log("new title"); instead of
document.write("new title"); then document.write page loading time.
you have change scripts , replace document.write()
i put code createelement , on comment work.
<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 have javascript turned off.</script> <br /> <b>listeners:</b> <script type="text/javascript" src="http://shoutcast.mixstream.net/js/listeners/uk23-free:5106"> appear 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 object of head element of current page // var hdel = document.getelementsbytagname("song"); // // //check appended child // //(it ensures each time button pressed // // removes loaded script element) // if (hdel.childnodes.length > 1) { // hdel.removechild(hdel.lastchild); // } // // // add new element head tag // // // //create '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"); // // // add new element head tag // hdel.appendchild(scrpte); // // document.getelementsbytagname("song").appendchild(scrpte); // //this old: // settimeout("alert("ojk");",timeoutperiod); // // 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> update:
then....
i change site , function!!! , on pc site refresh every 5 second!!! have 2 particular errors.
this work have particular error. resource interpreted script transferred mime type text/html: "http://xxxx". on sentence n° 13 , sentence n°18.
http://xxxx this error find tool's chrome (inspect element).
the solution on stackoverflow or prefier blog.
i have software kubuntu (kde + ubuntu) , don't know change value 's registry.
solution:
<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 have javascript turned off.</script> <br /> <b>listeners:</b> <script type="text/javascript" src="xxxx"> appear 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 old: //settimeout("location.reload(true);",timeoutperiod); // function!!! settimeout("document.getelementbyid('info').innerhtml = document.getelementbyid('info').innerhtml;",timeoutperiod); } </script> </body> </html> or other solution:
<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 have javascript turned off.</script> <br /> <b>listeners:</b> <script type="text/javascript" src="xxxxx"> appear 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> this old site not refresh site.
<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 have javascript turned off.</script> <br /> <b>listeners:</b> <script type="text/javascript" src="xxxx"> appear 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>
Comments
Post a Comment