JS Window

最新推荐文章于 2025-01-09 21:00:35 发布

ElegantIce

最新推荐文章于 2025-01-09 21:00:35 发布

阅读量448

点赞数 1

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/ElegantIce/article/details/50696297

javascript 专栏收录该内容

7 篇文章

订阅专栏

浏览器对象模型BOM是在说整个浏览器窗口就是一个对象，这个对象的名字就叫做Window，这个对象有很多的方法和属性。相比于DOM_文档对象模型，DOM多指页面的内容，BOM多指页面。BOM包含了DOM？

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

document.getElementById("header");

这个document就是window的一个属性，即是：

window.document.getElementById("header");

window.screen算是window对象里的一个属性，跟document一样，可以不使用window前缀。

所以screen和document一样，直接称为对象就好。（有共同的父亲，而且可以不用父亲前缀）

screen包含了用户屏幕信息。是显示器屏幕，不是窗口屏幕。像下面的菜单栏是不计算在内的，当然也不是显示器屏幕，是减去界面特性，比如窗口任务栏。

<script>
document.write("可用宽度：" + screen.availWidth);
document.write("可用高度：" + screen.availHeight);
</script>

window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面。
window.location 对象在编写时可不使用 window 这个前缀。

<!DOCTYPE html>
<html>
<head>
<script>
function newDoc()
 {
 window.location.assign("http://www.w3school.com.cn")
 }
</script>
</head>
<body>

<input type="button" value="加载新文档" onclick="newDoc()">

</body>http://write.blog.youkuaiyun.com/postedit?ref=toolbar
</html>

点击按钮就会传送到W3school的首页了，也可以吧window去掉变成：

location.assign("http://www.w3school.com.cn")

另外俩个属性：

location.href 属性返回当前页面的 URL，这是个完整的连接
location.pathname 属性返回 URL 的路径名。

window.history 对象包含浏览器的历史。

history.back()后退到上一个URL。

history.forward()是向前一个。可以用在一个button标签里。

window.navigator 对象包含有关访问者浏览器的信息。

这里很多属性我也看不懂。好像是下载别的浏览器也是要用带IE自带浏览器的内容，大概IE就是类似一个集成开发环境，比如javaeclipse，里面有最基础的东西。别的浏览器也要用。

JavaScript消息框

alert()是警告框。警告框里的用/n可以换行。

confirm()是确认框，警告框是提示，点了确定就可以继续。确认框有两个按钮，两个逻辑值。确定是true，取消是false。所以要自己添加判断语句：

<html>
<head>
<script type="text/javascript">
function show_confirm()
{
var r=confirm("Press a button!");
if (r==true)
  {
  alert("You pressed OK!");
  }
else
  {
  alert("You pressed Cancel!");
  }
}
</script>
</head>
<body>

<input type="button" onclick="show_confirm()" value="Show a confirm box" />

</body>
</html>

提示框prompt()有两个参数，第一个参数和警告框一样，是框里的内容。第二个则是文本框里的默认内容。提示框有一个文本框要求输入内容。

JavaScript计时对象：可以不立刻启动函数，可以规定在一个时间之后再调用。

setTimeOut()函数，第一个参数是要做的事件，比如启动一个警告框。第二参数是设置时间，以毫秒计时。比如五秒后启动一个警告框：

var t=setTimeout("alert('5 秒！')",5000)

下面是一个简单的计时代码，之前提到过，但是我弄错了setTimeOut方法的意思

<html>
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}
</script>
</head>

<body>

<form>
<input type="button" value="开始计时！" onClick="timedCount()">
<input type="text" id="txt">
</form>

<p>请点击上面的按钮。输入框会从 0 开始一直进行计时。</p>

</body>

</html>

这里是在按钮处启动第一个timedCount函数，文本框里的值自加一，然后再次执行这个函数无限循环。这是自调用无限循环，之前以为setTimeOut函数本身就是循环执行呢。但这个按钮你按几次之后计时就变非常快了，说明每按下去一次就会产生一个无限循环函数在运行。按三次相当于每一秒计三下。

然后如何停止计时功能呢？这里能看出来，JavaScript并不是顺序执行代码的，是事件驱动呢，在无限循环的函数里，用别的事件调用别的函数可以把刚才的死循环给解决掉。

上面的代码可以看到setTimeOut是一个有返回值的函数，那么用这个返回值做参数，调用一次clearTimeOut()就可以了，这个没有返回值。

cookie对象用来识别用户，可以储存名字，密码，时间之类的信息。