- A+
这些JS代码全部应用在HTML页代码中。在<head>和</head>之间。外部由一个单独的XX.JS文件。JS里的效果实现代码全部放在这里面。然后再在要引用的页面上加上下面的一些链接式代码即可。
1、浏览网页时，在页面上弹出信息。
1）<Script
Language="JavaScript">
alert("这也是一个弹出对话框！");
</Script>
2）<Script Language="VBScript">
MsgBox
"你输入有误，请重新输入！"
</Script>
2、打开窗口弹出对话框代码，放在body任何位置。
<SCRIPT
LANGVAGE="JAVASCRIP">
<!--
WINDOW-OPEN:'PAGE.HTML', 'new window', 'height= , width= ,top= left=
tollbar=yes/no滚动栏是否显示,
menubar=yes/no菜单栏,scrollbars=yes/no,
resizable=yes/no改变窗口大小,
location=yes/no显示地址栏，status=yes/no显示状态栏内的信息
//->
</SCRIPT>
3、我需要作这样一个连接，点击弹出一个新窗口。新窗口不能有滚动条、不能有状态栏、不能有工具栏！
height=100：窗口高度
width=100:窗口宽度
top=0:窗口距离屏幕上方的像素值
left=0:窗口距离屏幕左侧的像素值
toolbar=no：是否显示工具栏，yes为显示
menubar,xcrollbars:表示菜单栏和滚动条
status=no：是否显示状态栏内信息，yes为允许
【1、最基本的弹出窗口代码】
<SCRIPT
LANGUAGE='javascript'>
<!--
window.open
('page.html')
-->
</SCRIPT>
4、用JS控制出现对话框的顺序；在头部里，标题下。
<script language="javascript">
var
x;
x=prompt("我们认识吗，点击确定输入你的大名，看我们是否以前认识。","1");
document.write("不知道"+x+"<br>")
//
"+"用来连接多个字符串
document.write("我们可能以前在网上聊过天吧？不过我不能加你。因为我不知道你");
alert("欢迎下次光临!");
</script>
5、显示时间
<script language="javascript">
<!--
var now=new
Date( );
var hour=now.getHours();
if (hour>=0 && hour
<=12)
document.write("上午好");
if (hour>12 && hour
<18)
document.write("下午好");
if (hour>18 && hour
<24)
document.write("晚上好");
document.write("<p> 今 天
日期："now.getYear()+"年"+(now.getMonth(
)+1)+"月"+now.getDate()+"日");
document.write("<p> 现 在
时间："now.getHours()+"点"+now.getMinutes( )+"分"+now.getSeconds( )+"秒");
//
-->
</script>
6、正在运行的时间(只是显示出来，具体还要看调用的情况)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>正在运行的时钟</title>
<script
language="JavaScript">
<!--
function disptime( )
{
var time =
new Date( ); //获得当前时间
var hour = time.getHours( ); //获得小时、分钟、秒
var minute
= time.getMinutes( );
var second = time.getSeconds( );
var apm="AM";
//默认显示上午： AM
if (hour>12) //按12小时制显示
{
hour=hour-12;
apm="PM"
;
}
if (minute < 10) //如果分钟只有1位，补0显示
minute="0"+minute;
if
(second < 10) //如果秒数只有1位，补0显示
second="0"+second;
document.myform.myclock.value
=hour+":"+minute+":"+second+" "+apm;
var myTime =
setTimeout("disptime",1000);
}
//-->
</script>
<style
type="text/css">
<!--
input{
font-size:50px;
color:#CC0000;
border-style:none;
}
-->
</style>
</head>
<body
onLoad="disptime( )">
<form name="myform"><div
align="center">
<input name="myclock" type="text" value=""
size="15">
</div>
</form>
</body>
<html>
11、打开关闭窗口
<script> function
openwindow()
{window.open("google.html"); //window可省略
}
function
closewindow()
{window.close();
//window可省略
}
</script>
………………
<body>
<form>
<input
type="button" value="打开窗口" onClick="openwindow()">
<input type="button"
value="关闭窗口" onClick="closewindow()">
</form>
</body>
7、网页漂浮物
<html>
<head>
<script
language="javascript">
function move( )
{
// getElementById(
)方法根据ID名称获得层对象Layer1
解释：层的起点位置坐标随机改变。
document.getElementByIdx("Layer1").style.left=Math.random(
)*500; //产生
0~1的随机数
document.getElementByIdx("Layer1").style.top=Math.random()*500;
setTimeout("move()",800);
//解释后最后一句：每隔800毫秒，循环调用move()函数，达到随机飘浮的效果
}
</script>
</head>
<body
onLoad="move()"">
<div id="Layer1" style="position:absolute; left:14px;
top:44px; width:150px; height:102px; z-index:1">
<a href=http://www.zhangjianqun.com><img src="piaofu.jpg" alt="网页中利用JS调用代码"
width="150"
height="100">
</a>
</div>
<h2>随机漂浮的广告</h2>
</body>
<html>
8、变背景色（根据鼠标移动到不同的地方，想要背景色显示的颜色）
<head>
<meta
http-equiv="content-type" content="text/html;
charset=gb2312">
<title>改变背景颜色</title>
<script
language="javascript">
function
change(color)
{
document.bgColor=color ;
//改变页面的背景色
}
</script>
</head>
<body>
<h2>移过来我变色给你看看!</h2>
<font
size="4">
<span
onMouseOver="change('red')">变红色</span>
<span
onMouseover="change('blue')">变蓝色</span>
<span
onMouseover="change('yellow')">变黄色</span>
</font>
</body>
- 我的微信
- 这是我的微信扫一扫
-
- 我的微信公众号
- 我的微信公众号扫一扫
-
