1.BOM的概述
browser object modal :浏览器对象模型。
浏览器对象：window对象。
Window 对象会在 <body> 或 <frameset> 每次出现时被自动创建。
2. window的属性
innerHeight:
innerWidth: IE不支持
</head>
<script type="text/javascript">
<!--
/*
window对象的属性：
1.innerHeight: 返回文档显示区的高度
2.innerWidth: 返回文档显示区的宽度 IE不支持
通用写法： window.document.body.clientWidth ;
3. outerheight 包括了工具栏，菜单栏等的高度
4. outerwidth 包括滚动条的宽度
*/
function init(){
var x = window.document.body.clientWidth ;
var y = window.document.body.clientHeight ;
alert(x + ":" + y) ;
}
//-->
</script>
<body onload = "init()">
<p>你好</p>
</body> self :等同于window对象
opener：是打开窗口的父窗口对象。
2种情况下使用opener:
1.使用winodw.open()方法打开的页面
2.超链（里面的target属性要设置成_blank）
open方法，是打开一个页面.
<script type="text/javascript">
<!--
function fun(){
window.open("sub.html","","width=200,height=200,status=no,titlebar=no,menubar=no,toolbar=no,resizable=0") ;
}
//-->
</script>
<body>
<input type="button" value="打开sub.html页面" onclick="fun()">
</body> function fun(){
self.open("sub.html") ;
}
</script>
<body>
<input type="text" name="" id = "txt">
<input type="button" value="打开sub.html页面" onclick="fun()">
<a href = "sub.html" target = "_blank">打开sub.html页面</a>
</body>close方法
<body>
<script type="text/javascript">
<!--
window.close() ;
//-->
</script>
</body>parent：是打开窗口的父窗口对象
2种情况下使用parent:
1.iframe 框架
2.frame 框架
frames[]: 数组类型，代表子窗口的window对象的集合,可以通过frames[索引]拿到子窗口的window对象。
示例：父子窗口相互传参.
<title>window对象的parent属性</title>
</head>
<script type="text/javascript">
<!--
function fun(){
//1.拿到文本框中填写的数据
var v = document.getElementById("txt").value ;
//2.拿到子窗口对象
var w = window.frames[0];
//3.拿到子窗口中的文本框对象
var txt = w.document.getElementById("txt") ;
//4.将内容赋值给父窗口中的文本框对象的value属性
txt.value = v ;
}
//-->
</script>
<body>
姓名：<input type="text" name="" id = "txt"><input type="button" value="传递数据到子窗口中" onclick="fun()">
<iframe src = "sub1.html"></iframe>
</body>sub1.html
</head>
<script type="text/javascript">
<!--
function fun(){
//1.拿到文本框中填写的数据
var v = document.getElementById("txt").value ;
//2.拿到父窗口对象
var w = window.parent;
//3.拿到父窗口中的文本框对象
var txt = w.document.getElementById("txt") ;
//4.将内容赋值给父窗口中的文本框对象的value属性
txt.value = v ;
}
//-->
</script>
<body>
<input type="text" name="" id = "txt"><input type="button" value="传递数据到父窗口中" onclick="fun()">
</body>
对话框：
1)消息框 alert() ;
2)确认框 confirm() ;
3)输入框 prompt() ; (了解)
<script type="text/javascript">
<!--
/*
三种对话框：1. 消息框：alert() ;
2. 确认框: confirm() :返回Boolean类型的值
3. 输入框: prompt(): 返回输入的字符串(了解)
*/
//window.alert("你好") ;
/*while(true){
if(confirm("你爱我吗？") == false)
continue ;
break ;
}*/
var a = prompt("请输入年龄：",12) ;
alert(a) ;
//-->
</script>window的模态窗体
<body>
<script type="text/javascript">
<!--
/*
模态窗体:
*/
// window.showModalDialog("你好") ;
window.showModelessDialog("你好");
//-->
</script>
</body> history对象
a. forward()前进
b. back() 后退
c. go(n) 正数是前进，负数是后退.
</head>
<script type="text/javascript">
<!--
/*
history对象存储了访问过的页面。
*/
function fun(){
history.forward();
}
//-->
</script>
<body>
<a href = "b.html">b.html</a>
<input type="button" value="前进" onclick="fun()">
</body>b.html
<script type="text/javascript">
<!--
/*
history对象存储了访问过的页面。
*/
function fun(){
history.forward();
}
function fun1(){
history.back() ;
}
function fun2(){
history.go(2) ;
}
//-->
</script>
<body>
<a href = "c.html">c.html</a>
<input type="button" value="前进" onclick="fun()">
<input type="button" value="后退" onclick="fun1()">
<input type="button" value="直接去d页面" onclick="fun2()">
</body>c.html
<script type="text/javascript">
<!--
/*
history对象存储了访问过的页面。
*/
function fun(){
history.forward();
}
function fun1(){
history.back() ;
}
function fun2(){
history.go(-2) ;
}
//-->
</script>
<body>
<a href = "d.html">d.html</a>
<input type="button" value="前进" onclick="fun()">
<input type="button" value="后退" onclick="fun1()">
<input type="button" value="直接去a页面" onclick="fun2()">
</bodyd.html
<script type="text/javascript">
<!--
/*
history对象存储了访问过的页面。
*/
function fun1(){
history.back() ;
}
function fun2(){
history.go(-3) ;
}
//-->
</script>
<body>
<input type="button" value="后退" onclick="fun1()">
<input type="button" value="直接去a页面" onclick="fun2()">
</body>location对象。
1.href 属性： 是指要连接到其他的URL
写法一、window.location.href='demo_window对象的close方法.html' ；
写法二、window.location='demo_window对象的close方法.html' ；
2.reload方法: 刷新
写法： window.location.reload() ；
<script type="text/javascript">
<!--
/*
掌握：1 href属性
2. reload()方法：重新加载本页面
*/
function fun(){
//window.location.href = "b.html" ;
window.location = "b.html" ;
}
function fun1(){
window.location.reload();
}
//-->
</script>
<body>
<input type="button" value="直接去b.html" onclick="fun()">
<input type="button" value="重新加载本页面" onclick="fun1()">
</body>跳转到其他页面
window.location.href=CONTEXT_PATH + "/subjectClassify/showSubjectClassifyNewsList?act=" + WebConst.EDIT+"&entityId="+subjectClassifyId;