JS 第三课

公告

昵称：夜雨初凉
园龄： 4年
粉丝： 0
关注： 1

+加关注

随笔分类

随笔档案

阅读排行榜

Posted on 2021-09-06 16:28 夜雨初凉阅读(14) 评论(0) 编辑收藏举报

地址对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			//BOM浏览器对象模型
			//location地址对象
			function openBd(){
				//window.location.href=""
				//window可以省略不写
				location.href="http://www.baidu.com";
			}
			
			function rePg(){
				//重新加载页面
				location.reload();
			}
			
			//删除的逻辑
			function del(){
				//提示功能 -- 确认要删除吗?
				var con=confirm("确认要删除吗?");
				if(con){
					//确认时 -- 使用删除逻辑
				}
			}
			
			//宽度width=400,
			//高度height=240,
			//距离顶部top=400,
			//距离左边left=500
			//单位px
			//window.open 弹出新窗体
			//adv.html 表示弹出的页面
			//_blank 窗体标题
			//toolbar=no 显示工具栏,yes显示
			//resizable=no 是否允许改变窗体大小,yes允许
			//location=no 是否显示地址栏,yes显示
			//status=no 是否显示状态栏,yes允许
			//menubar , scrollbars 菜单栏和滚动条
			//页面加载时,弹出一个广告
			function loadAdv(){
				//alert(1);
				window.open("adv.html","_blank","width=400,height=240,top=400,left=500");
			}
			
			//加载事件
			onload=loadAdv;
		</script>
	</head>
	<!--加载事件-->
	<!--<body onload="loadAdv()">-->
	<body>
		<!--在新的窗口打开 target="_blank"-->
		<a href="http://www.baidu.com" target="_blank">打开百度</a>
		<br/>
		<a href="#">刷新</a>
		<hr/>
		location对像<br/>
		<input type="button" value="打开百度" onclick="openBd()"/>
		<br/>
		<input type="button" value="刷新" onclick="rePg()"/>
		<br/>
		<input type="button" value="删除" onclick="del()"/>
	</body>
</html>

历史对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			//history 一定要在产生过浏览器记录的情况下,才会有历史记录
			function qianjin(){
				//调用历史方法
				history.forward();
				//go(数字)表示前进的页数
				//history.go(1);
			}
		</script>
	</head>
	<body>
		<a href="adv.html">打开广告</a>
		<br/>
		<input type="button" value="前进" onclick="qianjin()"/>
	</body>
</html>

定时器

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
		<script>
			//只是一个弹出窗体
			function loadAdv(){
				window.open("adv.html","_blank","width=400,height=240,top=400,left=500");
			}
		
			//延时器setTimeout 间隔时间执行一次
			//清空定时器clearInterval()
			//定时器setInterval 间隔时间循环执行
			//清空延时器clearTimeout()
			
			var si;
			//启动定时器
			function startInt(){
				//时间千万不要设置太短,否则后果自负
				si=window.setInterval("loadAdv()",2000);	
			}
			
			//关闭定时器
			function endInt(){
				//清空定时器
				clearInterval(si);
			}
		</script>
		
		<script>
			var wi; 
			function openWin(){
				//打开 -- 使用对象接收
				wi=window.open("adv.html","_blank","width=400,height=240,top=400,left=500");
			}	
				
			function closeWin(){
				//关闭 -- 使用对象关闭方法
				wi.close();
			}	
		</script>
		
	</head>
	<body>
		<input type="button" value="启动" onclick="startInt()"/>
		<input type="button" value="停止" onclick="endInt()"/>
		<hr/>
		<input type="button" value="打开窗体" onclick="openWin()"/>
		<input type="button" value="关闭窗体" onclick="closeWin()"/>
	</body>
</html>

悬浮事件

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			//onmouseover鼠标悬浮时
			//onmouseout 鼠标离开时
			
			// function onover(){
			// 	var im=document.getElementById("im");
			// 	//im.id
			// 	//im.src
			// 	//im.name
			// 	//im.....
			// 	im.src="img/b2.gif";
			// }
			
			// function onout(){
			// 	var im=document.getElementById("im");
			// 	im.src="img/b1.gif";
			// }
			
			function changeImg(v){
				document.getElementById("im").src="img/b"+v+".gif";
			}
			
		</script>
	</head>
	<body>
		<!-- <img id="im" src="img/b1.gif" onmouseover="onover()" onmouseout="onout()"/> -->
		<img id="im" src="img/b1.gif" onmouseover="changeImg(2)" onmouseout="changeImg(1)"/>
	</body>
</html>