javascript语言.docx
《javascript语言.docx》由会员分享,可在线阅读,更多相关《javascript语言.docx(17页珍藏版)》请在冰点文库上搜索。
javascript语言
onClick="location.href='
常用的javascript语句集
(二)
上次整理了“常用的javascript语句集
(一)”,觉得不够完整,今天看了一个别人整理的,于是自己添加一些又整理了“常用的javascript语句集
(二)”。
下面列出些常用的javascript,大家可以把这些做成一个类,方便在项目中重复的调用。
欢迎大家补充^_^
1.让文字不停地滚动
<MARQUEE>滚动文字</MARQUEE>
2.记录并显示网页的最后修改时间
<scriptlanguage=javascript>
document.write("最后更新时间:
"+document.lastModified+"")
</script>
3.关闭当前窗口
<ahref="/"onClick="javascript:
window.close();returnfalse;">关闭窗口</a>
4.5秒后关闭当前页
<scriptlanguage="javascript">
<!
--
setTimeout('window.close();',5000);
-->
</script>
5.2秒后载入指定网页
<head>
<metahttp-equiv="“refresh”"content="2;URL=http:
//你的网址">
</head>
6.添加到收藏夹
<ScriptLanguage="javascript">
functionbookmarkit()
{
window.external.addFavorite('http:
//你的网址','你的网站名称')
}
if(document.all)document.write('<ahref="#"onClick="bookmarkit()">加入收藏夹</a>')
</Script>
7.让超链接不显示下划线
<styletype="text/css">
<!
-
a:
link{text-decoration:
none}
a:
hover{text-decoration:
none}
a:
visited{text-decoration:
none}
->
</style>
8.让网页随意后退
<ahref="javascript:
history.go(-X)">X</a>
//把X换成你想要后退在页数把“-”变成“+”就为前进
9.设置该页为首页
<bodybgcolor="#FFFFFF"text="#000000">
<!
--网址:
http:
//你的网址-->
<aclass="chlnk"style="cursor:
hand"HREF
onClick="this.style.behavior='url(#default#homepage)';
this.setHomePage('你的网站名称);"><fontcolor="000000"size="2"face="宋体">设为首页</font></a></body>
10.节日倒计时
<ScriptLanguage="javascript">
vartimedate=newDate("December25,2003");
vartimes="圣诞节";
varnow=newDate();
vardate=timedate.getTime()-now.getTime();
vartime=Math.floor(date/(1000*60*60*24));
if(time>=0)
document.write("现在离"+times+"还有:
"+time+"天")</Script>
11.单击按钮打印出当前页
<ScriptLanguage="javascript">
<!
--Begin
if(window.print){
document.write('<form>'
+'<inputtype=buttonname=printvalue="打印本页"'
+'onClick="javascript:
window.print()"></form>');
}
//End-->
</Script>
12.单击按钮‘另存为’当前页
<inputtype="button"name="Button"value="保存本页"
onClick="document.all.button.ExecWB(4,1)">
<objectid="button"
width=0
height=0
classid="CLSID:
8856F961-340A-11D0-A96B-00C04FD705A2">
<embedwidth="0"height="0"></embed>
</object>
13.显示系统当前日期
<scriptlanguage=javascript>
today=newDate();
functiondate(){
this.length=date.arguments.length
for(vari=0;i<this.length;i++)
this[i+1]=date.arguments}
vard=newdate("星期日","星期一","星期二","星期三","星期四","星期五","星期六");
document.write(
"<fontcolor=##000000style='font-size:
9pt;font-family:
宋体'>",
today.getYear(),"年",today.getMonth()+1,"月",today.getDate(),"日",
d[today.getDay()+1],"</font>");
</script>
14.不同时间段显示不同问候语
<ScriptLanguage="javascript">
<!
--
vartext="";day=newDate();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">
<scriptlanguage="javascript">
functionf1()
{
setInterval("mdiv.filters.wave.phase+=10",100);
}
if(document.all)
{
document.write('<imgid=mdivsrc="'+document.all.reflect.src+'"
style="filter:
wave(strength=3,freq=3,phase=0,lightstrength=30)blur()flipv()">')
window.onload=f1
}
</script>
16.慢慢变大的窗口
<ScriptLanguage="javascript">
<!
--
varWindowsheight=100
varWindowswidth=100
varnumx=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()
}
functiontenumxt(){
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><ahref="javascript:
openwindow()">进入</a>
17.改变IE地址栏的IE图标
我们要先做一个16*16的icon(图标文件),保存为index.ico。
把这个图标文件上传到根目录下并在首页<head></head>之间加上如下代码:
<linkREL="ShortcutIcon"href="index.ico">
18.鼠标指向时弹出信息框
<body>
<ahrefonmouseover="alert('弹出信息!
')">显示的链接文字</a>
</body>
19.单击鼠标右键弹出添加收藏夹对话框
<body>
<scriptLanguage=javascript>
if(document.all)
document.body.onmousedown=newfunction("if(event.button==2||event.button==3)
window.external.addFavorite('您的网址','您的网站名称)")
</script></body>
20.离开网页时和加载网站时提示你将本站加入收藏夹可以很大的加大的网站的访问量。
一、在网页的标记中加入下面的代码:
onunload=favorate()
当然如果你想在网页载入时提示只需要把
上面的onunload=favorate()改成onload=favorate
下面是禁止点击右键的代码,放在
与之间
functionclick(){
if(event.button==2){
alert('这里输入警告内容')
}
}
document.onmousedown=click
搜索表单代码:
functionbaidusearch(id){
varurl="+encodeURIComponent(document.getElementById(id).value);
window.open(url,"_blank");
}
CSS
用cursor属性可以实现,可选值及说明如表2.1.6.2所示。
表2.1.6.2cursor属性的可选值
可选值说明
hand手型
crosshair十字型
text鼠标移动到水平文本上的样式
wait等待
default系统默认样式
help带问号的样式
e-resize向右的箭头
ne-resize向右上方的箭头
n-resize向上的箭头
nw-resize向左上方的箭头
w-resize向左的箭关
sw-resize向左下的箭头
s-resize向下的箭头
se-resize向右下方的箭头
auto系统自动应用的样式
move十字箭头,移动对象时的样式
pointer鼠标移上链接时的样式,同hand(需IE6+支持)
all-scroll中间一小圆点,上、下、左、右四个方向是箭头的样式,表示页面可以向任意方向滚动(需IE6+支持)
col-resize左右两个箭头,中间以两条垂线分开,表示项目/栏的大小可以在水平方向上改变(需IE6+支持)
no-drop左边为手型,右边为斜线穿过的小圆圈,表示可拖动项目在当前鼠标位置不能放开.
not-allowed斜线穿过的小圆圈,表示所请求的动作不能被执行(需IE6+支持)
progress指针旁有沙漏标志,表示后台有程序在运行,用户与此页面的交互不受影响(需IE6+支持)
row-resize上下两个箭头,中间以两条水平线分开,表示项目/栏的大小可以在垂直方向上改变(需IE6+支持)
url(uri)指针由作者定义,使用自定义通用资源识别码,例如url(’mycursor.cur’)。
.cir,.ani类型的指针是唯一被支持的指针类型。
(需IE6+支持)
vertical-text可编辑的垂直文本样式,以一个水平翻转的I来表示(需IE6+支持)
JavaScript制作鼠标右键事件特效
超酷网页右键菜单body{
font-family:
"宋体";
font-size:
12px;
margin-left:
0px;
margin-top:
10px;
margin-right:
0px;
margin-bottom:
0px;
}
/*定义菜单方框的样式1*/
.skin0{
position:
absolute;
padding-top:
4px;
text-align:
left;
width:
100px;/*宽度,可以根据实际的菜单项目名称的长度进行适当地调整*/
border:
1pxsolidblack;
background-color:
menu;/*菜单的背景颜色方案,这里选择了系统默认的菜单颜色*/
font-family:
"宋体";
line-height:
20px;
cursor:
default;
visibility:
hidden;/*初始时,设置为不可见*/
}
/*定义菜单方框的样式2*/
.skin1{
padding-top:
4px;
cursor:
default;
font:
menutext;
position:
absolute;
text-align:
left;
font-family:
"宋体";
font-size:
10pt;
width:
100px;/*宽度,可以根据实际的菜单项目名称的长度进行适当地调整*/
background-color:
menu;/*菜单的背景颜色方案,这里选择了系统默认的菜单颜色*/
border:
1solidbuttonface;
visibility:
hidden;/*初始时,设置为不可见*/
border:
2outsetbuttonhighlight;
}
/*定义菜单条的显示样式*/
.menuitems{
padding:
2px1px2px10px;
}
-->
--
//定义菜单显示的外观,可以从上面定义的2种格式中选择其一
varmenuskin="skin1";
//是否在浏览器窗口的状态行中显示菜单项目条对应的链接字符串
vardisplay_url=0;
functionshowmenuie5(){
//获取当前鼠标右键按下后的位置,据此定义菜单显示的位置
varrightedge=document.body.clientWidth-event.clientX;
varbottomedge=document.body.clientHeight-event.clientY;
//如果从鼠标位置到窗口右边的空间小于菜单的宽度,就定位菜单的左坐标(Left)为当前鼠标位置向左一个菜单宽度
if(rightedgeie5menu.style.left=document.body.scrollLeft+event.clientX-ie5menu.offsetWidth;
else
//否则,就定位菜单的左坐标为当前鼠标位置
ie5menu.style.left=document.body.scrollLeft+event.clientX;
//如果从鼠标位置到窗口下边的空间小于菜单的高度,就定位菜单的上坐标(Top)为当前鼠标位置向上一个菜单高度
if(bottomedgeie5menu.style.top=document.body.scrollTop+event.clientY-ie5menu.offsetHeight;
else
//否则,就定位菜单的上坐标为当前鼠标位置
ie5menu.style.top=document.body.scrollTop+event.clientY;
//设置菜单可见
ie5menu.style.visibility="visible";
returnfalse;
}
functionhidemenuie5(){
//隐藏菜单
//很简单,设置visibility为hidden就OK!
ie5menu.style.visibility="hidden";
}
functionhighlightie5(){
//高亮度鼠标经过的菜单条项目
//如果鼠标经过的对象是menuitems,就重新设置背景色与前景色
//event.srcElement.className表示事件来自对象的名称,必须首先判断这个值,这很重要!
if(event.srcElement.className=="menuitems"){
event.srcElement.style.backgroundColor="highlight";
event.srcElement.style.color="white";
//将链接信息显示到状态行
//event.srcElement.url表示事件来自对象表示的链接URL
if(display_url)
window.status=event.srcElement.url;
}
}
functionlowlightie5(){
//恢复菜单条项目的正常显示
if(event.srcElement.className=="menuitems"){
event.srcElement.style.backgroundColor="";
event.srcElement.style.color="black";
window.status="";
}
}
//右键下拉菜单功能跳转
functionjumptoie5(){
//转到新的链接位置
varseltext=window.document.selection.createRange().text
if(event.srcElement.className=="menuitems"){
//如果存在打开链接的目标窗口,就在那个窗口中打开链接
if(event.srcElement.getAttribute("target")!
=null)
window.open(event.srcElement.url,event.srcElement.getAttribute("target"));
else
//否则,在当前窗口打开链接
window.location=event.srcElement.url;
}
}
//-->