1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 2 <!-- saved from url=(0033)https://192.168.1.2/topframe6.htm --> 3 <HTML><HEAD><TITLE>topframe</TITLE> 4 <META http-equiv=Content-Type content="text/html; charset=utf-8"> 5 <link href="css/base.css" rel="stylesheet" type="text/css"> 6 7 <SCRIPT language=JavaScript> 8 var currentid = "c1"; 9 function openurl2(newid, url1, url2) 10 { 11 document.getElementById(currentid).className = ""; 12 document.getElementById(newid).className = "current"; 13 currentid = newid; 14 15 window.parent.document.getElementById("menu").src = url1; 16 window.parent.document.getElementById("content").src = url2; 17 } 18 19 function myrefresh() 20 { 21 window.parent.frames["topframe"].location.reload(); 22 } 23 setTimeout(‘myrefresh()‘,600000); 24 25 function blink (err_id) { 26 var code = ‘‘; 27 var speed = 500; 28 29 code += ‘var el = document.getElementById("‘ + err_id + ‘");‘; 30 code += ‘el.style.visibility = ‘ + ‘el.style.visibility == "hidden" ? "visible" : "hidden"‘; 31 32 var interval=setInterval(code,speed); 33 var desc_id=document.getElementById("desc_err"); 34 desc_id.onmouseover=function(){clearInterval(interval)} 35 desc_id.onmouseout=function(){interval=setInterval(code,speed)} 36 } 37 function stateOnload() { 38 blink(‘desc_err‘); 39 } 40 </SCRIPT> 41 </HEAD> 42 43 <BODY ONLOAD="stateOnload()" style="padding:0px"> 44 <div id="top"> 45 <div id="logo"></div> 46 <div> 47 <div id="list"> 48 <UL> 49 <LI id=c1 class=current> 50 <A href="javascript:openurl2(‘c1‘, ‘/View/menu‘, ‘/undefined‘)">查看</A> 51 </LI> 52 <LI id=c2><A href="javascript:openurl2(‘c2‘, ‘/Manage/menu‘, ‘/undefined‘)">管理</A></LI> 53 <LI id=c3><A href="javascript:openurl2(‘c3‘, ‘/Maintain/menu‘, ‘/undefined‘)">维护</A></LI> 54 </UL> 55 </div> 56 {% module Workstate() %} //<div id="desc_err"><A href="javascript:openurl2(\‘c1\‘, \‘/View/menu\‘, \‘/View/faultyinfo\‘)">工作故障</A></div> 57 </div> 58 </div> 59 60 </BODY> 61 </HTML>
上述代码说明:
1.function myrefresh():实现定时刷新top.htm页面
window.parent.frames["topframe"].location.reload();
2.function blink (err_id):实现字体闪烁
desc_id.onmouseover=function(){clearInterval(interval)} --鼠标位于字体上时,停止闪烁,以便点击进行超链接
desc_id.onmouseout=function(){interval=setInterval(code,speed)} --鼠标离开字体上时,继续闪烁
3.代码第56行{% module Workstate() %}
实际代码为:<div id="desc_err"><A href="javascript:openurl2(\‘c1\‘, \‘/View/menu\‘, \‘/View/faultyinfo\‘)">工作故障</A></div>
当点击字体之后连接到/View/faultyinfo,通过JS函数function openurl2(newid, url1, url2)将整个页面的几个框架(FRAME)分别进行链接
4.setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。
提示:setTimeout() 只执行 code 一次。如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
简单示例:
1 <html> 2 <head> 3 <script type="text/javascript"> 4 var c=0 5 var t 6 function timedCount() 7 { 8 document.getElementById(‘txt‘).value=c 9 c=c+1 10 t=setTimeout("timedCount()",1000) 11 } 12 </script> 13 </head> 14 15 <body> 16 <form> 17 <input type="button" value="开始计时!" onClick="timedCount()"> 18 <input type="text" id="txt"> 19 </form> 20 <p>请点击上面的按钮。输入框会从 0 开始一直进行计时。</p> 21 </body> 22 23 </html>
5.setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。
setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
简单示例:
1 <html> 2 <body> 3 4 <input type="text" id="clock" size="35" /> 5 <script language=javascript> 6 var int=self.setInterval("clock()",50) 7 function clock() 8 { 9 var t=new Date() 10 document.getElementById("clock").value=t 11 } 12 </script> 13 <button onclick="int=window.clearInterval(int)">Stop interval</button> 14 15 </body> 16 </html>
PS:
起初实现文字闪烁代码如下:
1 function blink (elId) { 2 var html = ‘‘; 3 if (document.all) 4 html += ‘var el = document.all.‘ + elId + ‘;‘; 5 else if (document.getElementById) 6 html += ‘var el = document.getElementById("‘ + elId + ‘");‘; 7 html += ‘el.style.visibility = ‘ + ‘el.style.visibility == "hidden" ? "visible" : "hidden"‘; 8 if (document.all || document.getElementById) 9 setInterval(html, 500) 10 }
1.document.all是页面内所有元素的一个集合。例如:document.all(0)表示页面内第一个元素
2.document.all可以判断浏览器是否是IE
if(document.all){
alert("is IE!");
}
3.可以通过给某个元素设置id属性(id=aaaa),然后用document.all.aaaa调用该元素
综上:
当在IE浏览器执行时进入 :if (document.all)
当在其他浏览器执行时进入:else if (document.getElementById)
这里舍弃document.all,直接使用document.getElementById
HTML JS文字闪烁实现(项目top.htm分析),布布扣,bubuko.com