实例001 打开新窗口显示广告信息
实例说明
本实例要在窗口每次被加载的时候弹出一个广告对话框。
技术要点
本实例主要应用JavaScript的window对象。
| 方法 | 说明 |
|---|---|
| alert() | 弹出一个警告对话框 |
| confirm() | 在确认对话框中显示指定的字符串 |
| prompt() | 弹出一个提示对话框 |
| close() | 关闭被引用的窗口 |
| focus() | 将被引用的窗口放在所有打开窗口的前面 |
| open() | 打开新浏览器窗口并且显示由URL或名字引用的文档，并设置创建窗口的属性 |
| resizeTo(x,y) | 设置窗口的大小 |
| resizeBy(offsetx,offsety) | 按照指定的位移量设置窗口的大小 |
应用JavaScript的open()方法可以打开浏览器窗口.
使用window对象打开窗口的语法格式如下。
WindowVar = window.open(url,windowname,location);
参数说明如下：
1.WindowVar:当前打开窗口的句柄。
2.url:目标窗口的URL。
3.windowname:window:对象的名称。
4.location:对窗口属性进行设置。
| 属性 | 说明 |
|---|---|
| width | 窗口的宽度 |
| height | 窗口的高度 |
| scrollbars | 是否显示滚动条 |
| resizable | 设定窗口大小是否固定 |
| toolbar | 浏览器工具条，包括后退及前进按钮等 |
| menubar | 菜单条，一般包括有文件，编辑及其他一些条目 |
| location | 定位区，也叫地址栏，是可以输入URL的浏览器文本区 |
| direction | 更新信息按钮 |
实现过程
（1）首先创建用于弹出广告信息的页面，在该页面中添加所要宣传的广告信息。
new.html
<html>
<head>
<title>打开新窗口显示广告信息</title>
<style type="text/css">
body{
background-image:url(new.jpg);
background-repeat:no-repeat;
}
</style>
</head>
<body></body>
</html>
（2）在index.html页面写上JS代码实现功能
index.html
<html>
<head>
<meta charset="utf-8" />
<script type="text/jscript" language="javascript">
window.open("new.html","new","height=280,width=800,top=10,left=20,resizable=no, location=no",false);
</script>
<style type="text/css">
p{
font-size:24px;
color:#F00;
}
</style>
</head>
<body>
<p>网站首页</p>
</body>
</html>
注：style标签的内容为css的知识，我们关注的是script标签内的内容。
这样我们的这个实例就做好了。
时间： 2024-10-19 16:02:49