浏览器对象模型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="加载新文档" οnclick="newDoc()">
</body>http://write.blog.csdn.net/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" οnclick="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对象用来识别用户,可以储存名字,密码,时间之类的信息。