js---Bom window对象

最新推荐文章于 2023-06-05 11:06:32 发布

司天宏

最新推荐文章于 2023-06-05 11:06:32 发布

阅读量227

点赞数

本文链接：https://blog.csdn.net/qq_41532872/article/details/86513475

版权

前端专栏收录该内容

47 篇文章 0 订阅

订阅专栏


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<!--window是BOM中最顶级对象，代表整个浏览器窗口
			我们在页面上写的元素，js函数，全局变量都属于window对象，都可以
        	用window对象来调用.可以省略window.
        	window对象的子对象location，代表窗口的地址栏
        	location对象的href属性：设置或者获取地址栏上的地址(网址)
		-->
		<input type="button"   id="btn" value="改变网址"/>
		<script>
		  //	alert("aaa");
		   var btn= document.getElementById('btn');
		    btn.onclick=function(){
		    	 //将地址栏的网址变成百度的地址
		    	  //window.location.href="http://www.baidu.com";
		    	  location.href="http://www.baidu.com";
		    }
		    
		</script>
	</body>
</html>

BOM对象
1.前言
定义：浏览器对象模型（Browser Object Model）尚无正式标准。

作用：浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”。

由于现代浏览器已经（几乎）实现了 JavaScript 交互性方面的相同方法和属性，因此常被认为是 BOM 的方法和属性。

Window对象
所有浏览器都支持 window 对象，它表示浏览器窗口。

所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

全局变量是 window 对象的属性。

全局函数是 window 对象的方法。

甚至 HTML DOM 的 document 也是 window 对象的属性之一：

window.document.getElementById("box");

与此相同：

document.getElementById("header");

Window尺寸
有三种方法能够确定浏览器窗口的尺寸（浏览器的视口，不包括工具栏和滚动条）。

对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari：

window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
对于 Internet Explorer 8、7、6、5：

document.documentElement.clientHeight
document.documentElement.clientWidth
或者

document.body.clientHeight
document.body.clientWidth
实用的 JavaScript 方案（涵盖所有浏览器）：

var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

Window Location
window.location对象在编写时可不使用 window 这个前缀。

一些实例:

location.hostname 返回 web 主机的域名

location.pathname 返回当前页面的路径和文件名

location.port 返回 web 主机的端口（80 或 443）

location.protocol 返回所使用的 web 协议（http:// 或 https://）

location.href 属性返回当前页面的 URL。

设置 location.href = “http://www.baidu.com” 从而实现在本窗口中打开一个网址。

设置 location.reload() 从而实现刷新网页。

司天宏

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js---Bom window对象

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;!--window是BOM中最顶级对象，代表整个浏览器窗口
复制链接

扫一扫