j​a​v​a​s​c​r​i​p​t​经​典​常​用​小​例​子

来源:互联网 发布:我的世界编程教程 编辑:程序博客网 时间:2024/04/29 07:20
1. 让文字不停地滚动
<MARQUEE>文字滚动</MARQUEE>

2. 记录并显示网页的最后修改时间
<script type="text/javascript">
document.write("最后更新时间"+document.lastModified+"");
</script>

3. 关闭当前窗口
<a href="/" onClick="window.close();return false;">关闭窗口</a>

4. 5秒后关闭当前页
<script type="text/javascript">
        setTimeout("window.close();",5000);
</script>

5. 2秒后载入指定网页
<head>
<meta http-equiv="refresh" content="2;URL=http://www.baidu.com">
</head>

6. 添加到收藏夹
<script type="text/javascript">
function bookmarkit(){
window.external.addFavorite('http://www.baidu.com','百度')
}
</script>
<a href="#" coClick="bookmarkit()">加入收藏</a>

7. 让超链接不再显示下划线
<style type="text/css">
a:link{text-decoration:none}
a:hover{text-decoration:none}
a:visited{text-decoration:none}
</style>

8. 禁止鼠标右键的动作
<script type="text/javascript">
function click(){
if(event.button==2||event.button==3){
alert("禁止鼠标右键");
}
}
document.onmousedown=click
</script>

9. 设置该页为首页
 <body bgcolor="#FFFFFF" text="#000000">   
<!-- 网址:http://你的网址-->
<a class="chlnk" style="cursor:hand" HREF onClick="this.style.behavior='url
(#default#homepage)'; this.setHomePage('http://www.aqtc.edu.cn');">
<font color="000000" size="2" face="宋体">设为首页</font>
</a>
</body>

10. 节日倒计时 
<script type = "text/javascript">     
var timedate = new Date("December 25,2015");    var times="圣诞节";  
var now = new Date();     
var date = timedate.getTime() - now.getTime();    
var time = Math.floor(date/(1000*60*60*24));    
if(time >= 0)        
document.write("现在离"+times+"还有: "+time +"天")
</script> 

11. 单击按钮打印出当前页
<script type="text/javascript">
if(window.print){
       document.write('<form><input type=button name=print value="打印本页" conClick="window.print()"></form>')
}
</script>

12. 单击按钮‘另存为’当前页
<input type="button" name="Button" value="保存本页" onClick="document.all.button.ExecWB(4,1)">    
<object id="button" width=0  height=0  classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">
<embed width="0" height="0"></embed></object> 

13. 显示系统当前日期

<script type="text/javascript"> 
  today=new Date();
  function date(){
  this.length=date.arguments.length
  for(var i=0;ithis.length;i++)
  this[i+1]=date.arguments}
  var d=new date("星期日","星期一","星期二","星期三","星期四","星期五","星期六");
  document.write(
  "<font color=##000000style='font-size:9pt;font-family:宋体'>",
  today.getYear(),"",today.getMonth()+1,"",today.getDate(),"",
  d[today.getDay()+1],"</font>");
  </script>


14. 不同时间段显示不同问候语

<script type="text/javascript"> 
  var text="";day = new Date( ); time = day.getHours( );
  if (( time>=0) && (time<7 ))
    text="夜猫子,要注意身体哦! "
  if (( time>= 7 ) && (time<12))
    text="今天天气……哈哈哈,不去玩吗?"
  if (( time>= 12) && (time<14))
    text="午休时间哦,朋友一定是不习惯午睡的吧?!"
  if (( time>=14) && (time<18))
    text="下午茶的时间到了,休息一下吧! "
  if ((time>= 18) && (time<= 22))
    text="您又来了,可别和MM聊太久哦!"
  if ((time>= 22) && (time<24))
    text="很晚了哦,注意休息呀!"
  document.write(text)
</script>


15.水中倒影效果

<imgid="reflect" src="你自己的图片文件名" width="175"height="59">
<script type="text/javascript">
function f1(){
  setInterval("mdiv.filters.wave.phase+=10",100);

if (document.all)
{
  document.write('<img id=mdivsrc="'+document.all.reflect.src+'"
  style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30)blur() flipv()">')
  window.onload=f1
}
</script>


16.慢慢变大的窗口

<script type="text/javascript"> 
  var Windowsheight=100
  var Windowswidth=100
  var numx=5
  functionopenwindow(thelocation){
  temploc=thelocation
  if
  (!(window.resizeTo&&document.all)&&!(window.resizeTo&&document.getElementById))
  {
    window.open(thelocation)
    return
  }
  windowsize=window.open("","","scrollbars")
  windowsize.moveTo(0,0)
  windowsize.resizeTo(100,100)
  tenumxt()
  }
  function tenumxt(){
  if (Windowsheight>=screen.availHeight-3)
    numx=0
  windowsize.resizeBy(5,numx)
  Windowsheight+=5
  Windowswidth+=5
  if (Windowswidth>=screen.width-5)
  {
    windowsize.location=temploc
    Windowsheight=100
    Windowswidth=100
    numx=5
    return
  }
  setTimeout("tenumxt()",50)
  }
  </script> 
  <p><a href="javascript:openwindow(http://www.3ydesign.com)">进入</a>


17. 改变IE地址栏的IE图标

 我们要先做一个16*16icon(图标文件),保存为index.ico。把这个图标文件上传到根目录下并在首页<head></head>之间加上如下代码:

  <link REL = "ShortcutIcon" href="index.ico">


18. 在窗口的状态栏显示滚动信息  
(1) 在BODY中加入代码 
<script language="javascript">  
var msg="欢迎访问建站资源网,在这里有你会有所收获的!";  
var i=1  
function scroll()  
{  
mess=msg.substring(i,msg.length)+" "+msg.substring(0,i)  
window.status=mess  
i++;  
if (i>=msg.length) 

 i=1; //设置不停滚动 
setTimeout("scroll()",200); //设置滚动速度 
}  
</script>  

(2)BODY标签中:  
<body onload="scroll()">   


19、在页面加入当前时间  

<scriptlanguage="javascript">  
tdy=new Date();  
document.write("
当前时间:",tdy.getHours());  
document.write(":",tdy.getMinutes());  
document.write(":",tdy.getSeconds());  
</script>  


20、前进、后退按钮 
<input type="button" value="<-"onclick="history.go(-1)">  
<input type="button" value="->"onclick="history.go(1)">   


21、加入页面最后修改日期  
<script language="javascript">  
document.write("本页最后编辑日期:");  
document.write(document.lastModified)  
</script>  


22、前进、后退按钮 
<font onclick="history.go(-1)"> 前一页</font>  
<font onclick="history.go(-2)"> 前两页</font>  
<font onclick="history.go(-3)"> 前三页</font>  
<font onclick="history.go(1)"> 后一页</font>  
<font onclick="history.go(2)"> 后两页</font>  
<font onclick="history.go(3)"> 后三页</font>  
也可设置退后、前进多步 


23、鼠标事件 
<a href="MAILTO:webmaster@jzzy.com"onmouseover="alert("给我写信"); return true">信箱</a> 
鼠标放上去显示警告信息 


24、获得浏览器的属性 
navigator.appCodename=undefinednavigator.appName=Microsoft InternetExplorernavigator.appVersion=4.0 (compatible; MSIE 5.0; Windows 98;DigExt)navigator.appAgent=undefined  


25、打印整个页面 
<font onClick="javascript:window.print()">打印本页</font> 


26、查看源码 
<input TYPE="button" NAME="view" value="查看本页的源码"onClick="window.location="view-source:"+window.location.href" class="pt9"> r:line-break'> 

27、刷新页面 
<font onClick="history.go(0)">
刷新本页</font> 


28、背景色变换 
<input TYPE="button" value="
背景色变换"onClick="BgButton()"> 
<script type="text/javascript">

function BgButton() 

if (document.bgColor==#00ffff){ 
document.bgColor=#ffffff; 

else{

document.bgColor=#00ffff; 

}
</script> 


29Title上显示信息 
<script type="text/javascript">
<!--hide 
document.title="
今天是星期天
//--hide--> 
</script>


本文来自:http://wenku.baidu.com/link?url=nKtNTvo22BzujwLS4qaUXIwFhGmjVOLB7lQq_Uz6gKyQhW1bbaO-pVxamegKrj-XVRqIGbCpsBRem5op3oSFBGLKEeX0m_o-LcEJWI1vzDS

0 0
原创粉丝点击