Javascript 之 Windows对象

Javascript Windows对象

        所有浏览器都支持window 对象。它表示浏览器窗口。所有 JavaScript 全局对象、函数以及变量均自动成为window 对象的成员。也就是说全局变量是 window 对象的属性。全局函数是window 对象的方法。甚至 HTML DOM document 也是 window 对象的属性之一,如下

window.document.getElementById("header");

与此相同:

document.getElementById("header");

下面来介绍一些windows对象常用的一些方法函数

1.打开新窗口:window.open函数

比如:

打开网页,并且控制网页大小、尺寸

window.open("http://www.baidu.com","width=800,height=500,resizable=no");

 

普通方法打开网页

 window.open("http://www.baidu.com");

  

<html>
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
	<title></title>
		<script language="JavaScript">
			function fun(url){
				window.open(url,"页面标题","width=500,height=500");
			}
		</script>
    </head>
    <body >
		<form action="" method="post">
			<select name="favor" onChange="fun(this.value)">
				<option value="#">====请选择====</option>
				<option value="http://www.baidu.com">百度</option>
				<option value="http://www.google.com">谷歌</option>
			</select>
		</form>
    </body>
</html>

                        效果如图

2.确认窗口:window.confirm()

比如:var flag = window.confirm("确认?"); 如果选是,则返回true;否则返回false;

<html>
	<head>
		<title></title>
		<script language="JavaScript">
			(function fun(){
				if(window.confirm("确认")){
					alert("是");
				}
				else{
					alert("否");
				}
			})()
			//fun();
		</script>	
	</head>
	<body >	
	</body>
</html>

 

                             点击确认以后的效果图如下

3.页面重定向

通过window.location属性能够完成页面的转换;

只需要window.location="http://www.google.com"就能够将当前网页跳转到谷歌;

<html>
	<head>
		<title></title>
		<script language="JavaScript">
			function fun(url){
				window.location=url;   //将当前的网页的地址变换
			}
		</script>
		
	</head>
	<body >
		<form action="" method="post">
			<select name="favor" onChange="fun(this.value)">
				<option value="#">====请选择====</option>
				<option value="http://www.baidu.com">百度</option>
				<option value="http://www.google.com">谷歌</option>
			</select>
		</form>
	</body>
</html>

页面重定向是在当前网页跳转,不同于open方法 

4.在子窗口中操作父窗口 opener

通过window.opener.document可以获得父窗口的文档对象;

       window.opener.location可以获得父窗口地址;

       window.opener.location.reload();重新加载父窗口;

<!--父窗口:-->
<html>
	<head>
		<title></title>
		<script language="JavaScript">
			function fun(){
				window.open("two.html","页面标题","width=800,height=500,resizable=no");
			}
		</script>
		
	</head>
	<body >
		<form action="" method="post">
			<input type="button" value="打开子窗口" onClick="fun()"/>
		</form>
	</body>
</html>
<!--子窗口:-->
<html>
	<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
   
		<title></title>
		<script language="JavaScript">
		function fun(){
			window.opener.location="http://www.baidu.com";
		}
		</script>
	</head>
	<body >
		<input type="button" value="跳转到百度" onClick="fun()"/>
	</body>
</html>


 

第一次点击打开子窗体

点击跳转到百度


          这几个比较常用的方法函数对我们今后的设计都会有很大的帮助


评论 43
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

码海拾贝2023

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值