BOM浏览器对象
BOM 浏览器对象 一、浏览器本身就自己有一些对象，不用创建就可以使用 window(当前浏览器窗体)
属性：
status
opener
closed
parent
top 方法：
alert();
confirm();
setInterval();
clearInterval(); setTimeout();//只执行一次
clearTimeOut(); open();//打开一个新窗体 a链接也可以跳转打开新窗体，两者的区别是：window的open打开的窗体是有联系的，a链接的是没有任何关系的
closed 返回指定窗体是否是关闭的 document
frames
location
history
screen
... [window.]成员
document.write(); 本身window
open可以弹出子窗体
frams多个窗体
<html>
<head> </head> <body>
<a href="www.baiyu.com" onclick="return confirm('你确定要删除吗？')">删除</a>
</body>
</html>
confirm
<html>
<!-- 砰砰砰 游戏-->
<head> </head> <body onkeydown="js()">
<div id="one" style="position:absolute; top:0px; left:0px; width:100px; height:80px; background:red;">
</div> <script>
var sx=5;
var sy=5; var top_1=0;
var left_1=0;
var height_1=document.body.clientHeight;
var width_1=document.body.clientWidth;
var one=document.getElementById("one");
function sa(){
if(top_1>=(height_1-one.offsetHeight) || top_1<0){
sy=-1*sy;
}
if(left_1>=(width_1-one.offsetWidth) || left_1<0){
sx=-1*sx;
}
top_1+=sy;
left_1+=sx;
one.style.top=top_1;
one.style.left=left_1;
}
function js(){
sx=sx*2;
sy=sy*2;
}
var dt=setInterval("sa()",50);
one.onmouseover=function(){
clearInterval(dt);
}
one.onmouseout=function(){
dt=setInterval("sa()",50);
}
</script>
</body>
</html>
碰撞
<html>
<head>
</head>
<body onunload="clo()">
<!--<a href="01.html" target="_blank">新</a>-->
<script>
var subw=window.open("04.html","_blank","top=300,left=300,width=200,height=200");
/*
设置子窗口属性使用逗号隔开
父窗口操作子窗口使用的是子窗口名
*/
function show(obj){
subw.document.body.bgColor=obj.value;
}
function ss(){
window.document.title="guodaxia";
}
//closed返回指定窗体是否是关闭的
function clo(){
if(!subw.closed){
subw.close();
}
}
</script>
<input type="button" onclick="show(this)" value="red"><br/>
<input type="button" onclick="show(this)" value="green"><br/>
<input type="button" onclick="show(this)" value="yellow"><br/>
<input type="button" onclick="show(this)" value="blue"><br/>
<input type="button" onclick="show(this)" value="#ff00ff"><br/>
</body>
</html>
<html>
<head>
</head>
<body>
<script>
/*
子窗口中有一个opener属性，代表父窗口对象
*/
function show(obj){
opener.document.body.bgColor=obj.value;
}
opener.ss();//子窗口调用父窗口方法
</script>
<input type="button" onclick="show(this)" value="red"><br/>
<input type="button" onclick="show(this)" value="green"><br/>
<input type="button" onclick="show(this)" value="yellow"><br/>
<input type="button" onclick="show(this)" value="blue"><br/>
<input type="button" onclick="show(this)" value="#ff00ff"><br/>
</body>
</html>
open父子窗口
<html>
<head>
<style type="text/css">
frame{
border:1px solid red;
}
</style>
</head>
<frameset rows="100,*">
<frame name="top" />
<frameset cols="150,*">
<frame name="menu" src="menu.html"/>
<frame name="main" />
</frameset>
</frameset>
</html>
<html>
<head>
</head>
<body>
<input type="button" onclick="document.body.bgColor='yellow'" value="改自己的"/>
<input type="button" onclick="window.parent.parent.frames[0].document.body.bgColor='red'" value="改上面的"/>
<!--
<input type="button" onclick="window.parent.parent.frames[2].document.body.bgColor='blue'" value="改右边的"/>
-->
<input type="button" onclick="window.top.frames['main'].document.body.bgColor='blue'" value="改右边的"/>
</body>
<script>
/*
想要改变其他窗口就需要获取其他窗口的window对象，如何获取其他窗口的window对象呢？
我们前面在使用父子窗口的时候，子窗口是可以获取得到父窗口的，使用的是opener，父窗口获取子窗口使用的是window.子窗口名
使用frame，其实有点类型于子父窗口
注意在frame中获取父窗口使用的是parent属性，一般都是获取到顶层窗口再寻找指定窗口设置。获取到指定窗口后窗口下标是0开始，排序是从左往右，从上往下。如果只是获取上一个窗口操作可能发生错误。
一直找最外层窗口有点麻烦，我们可以使用top属性获取最外层的窗口对象，然后使用它的frames属性获取frames对象数组
*/
</script>
</html>
framms控制
windows对象中的常用对象属性
document
location
html跳转：
<meta http-equiv="refresh" content="3">三秒刷新一次
<meta http-equiv="refresh" content="3;url="http://www.baidu.com">三秒刷新跳转到指定页面 js跳转
window.navigate(url);//重定向
location.href='url';
location.replace('url);
history
back()
go(i) i表示向上返回的步数,i是负数
screen clipboardData剪切板对象
setData(数据类型字符串，数据对象);
<html>
<head>
<!--<meta http-equiv="refresh" content="3;02.html">-->
<meta http-equiv="refresh" content="3;url=02.html">
</head> <body> </body> <script>
document.write(new Date());
</script>
</html>
<html>
<head> </head> <body>
12131
</body>
<script>
setTimeout(function(){
//window.navigate("01.html");火符IE不兼容
//window.location.href="01.html";
//location="01.html";//这样简写也可以
location.replace("01.html");//这样会替换掉原来的链接，无法后退
location.reload();//重新加载
},3000);
</script>
</html>
刷新与跳转
<html>
<head></head>
<body>
<a href="two.html">向下</a>
</body> </html>
<html>
<head></head>
<body>
<a href="javascript:history.go(-1);">向上一步</a>
<a href="javascript:history.go(-2);">向上两步</a>
</body> </html>
<html>
<head></head>
<body>
<a href="three.html">向下</a>
<a href="javascript:history.back()">向上一步</a>
</body> </html>
history向上与向下
<html>
<head></head>
<body> </body>
<script>
with(document){
write("您的屏幕显示设定值如下：<p>");
write("屏幕的实际高度为"+screen.availHeight+"<br/>");
write("屏幕的实际宽度为"+screen.availWidth+"<br/>");
write("屏幕的色盘深度为"+screen.colorDepth+"<br/>");
write("屏幕区域的高度为"+screen.height+"<br/>");
write("屏幕区域的宽度为"+screen.width);
}
</script> </html>
屏幕对象
<html>
<head>
<!-- 复制到粘贴板 -->
</head> <body>
<!--都没成功
<a href="javascript:window.external.AddFavorite('07.html','07学习')">收藏</a>
<a href="javascript:this.setHomePage('07.html');">设为首页</a>
<div id="one">
-->
aaaaaaaaaaaaaaaaaaaaaaa<br/>
bbbbbbbbbbbbbbbbbbbbbbb<br/>
ccccccccccccccccccccccc<br/>
ddddddddddddddddddddddd<br/>
eeeeeeeeeeeeeeeeeeeeeee<br/>
</div>
<input type="button" onclick="copyc()" value="复制文本内容"/>
</body>
<script>
var one=document.getElementById("one"); function copyc(){
var content=one.innerText;
window.clipboardData.setData("Text",content);
}
</script>
</html>
复制文本到粘贴栏
BOM浏览器对象的更多相关文章
- BOM浏览器对象模型和API速查
什么是BOMBOM是Browser Object Model的缩写,简称浏览器对象模型BOM提供了独立于内容而与浏览器窗口进行交互的对象由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是wi ...
- JS BOM(浏览器对象)
BOM即浏览器对象模型,它包括如下一些对象! (一)screen对象,Screen 对象中存放着有关显示浏览器屏幕的信息. 常见的属性有: availHeight:返回显示屏幕的高度 availWid ...
- 浏览器（BOM）对象的一些内置方法总结
浏览器(BOM)对象的一些内置方法总结 一.总结 1.bom就是浏览器那端执行的代码,dom就是服务器那端操作html的代码 2.记好bom的几个对象,那就很好理解很多代码了,也很好写很多代码了 二. ...
- js中浏览器对象BOM
参考 : https://www.cnblogs.com/Peng2014/p/4725524.html 1. window对象 https://www.runoob.com/jsref/ob ...
- BOM浏览器对象模型
访问和操作浏览器窗口的模型称为浏览器对象模型BOM(Browser Object Model). BOM整体对象图. 核心是window对象: 以下有特殊双重身份: window对象既是ECMAScr ...
- DOM_05之DOM、BOM常用对象
1.HTML DOM常用对象之Table:①创建:createTHead():createTBody():createTFoot():②删除:deleteTHead():deleteTFoot():③ ...
- 6、JavaScript进阶篇③——浏览器对象、Dom对象
一.浏览器对象 1. window对象 window对象是BOM的核心,window对象指当前的浏览器窗口. window对象方法: 注意:在JavaScript基础篇中,已讲解了部分属性,windo ...
- Js浏览器对象
Js浏览器对象——window对象 1.window对象: (1)window对象是BOM的核心,window对象指当前的浏览器窗口. (2)所有的JavaScript全局对象.函数以及变量均自动成为 ...
- 第一百一十一节，JavaScript，BOM浏览器对象模型
JavaScript,BOM浏览器对象模型 学习要点: 1.window对象 2.location对象 3.history对象 BOM也叫浏览器对象模型,它提供了很多对象,用于访问浏览器的功能.BOM ...
随机推荐
- 自制 JS.format带分页索引
//第一参数是:Json对象,第二个是 序号 第三个 页数 第四 当前页数String.prototype.format = function (args, sid, pagesi ...
- mysql之触发器
触发器 MySQL语句在需要时被执行,存储过程也是如此.但是,如果你想要某条语句(或某些语句)在事件发生时自动执行,怎么办呢?例如:每当增加一个顾客到某个数据库表时,都检查其电话号码格式是否正 ...
- 集成 Tomcat 插件到 Eclipse 的过程
Java代码: . 下载 Tomcat Tomcat6,下载地址:http://tomcat.apache.org/download-60.cgi,选择绿色版的 zip 进行下载(目前最新的 Tomc ...
- nil和NULL
- Project Euler 103：Special subset sums: optimum 特殊的子集和：最优解
Special subset sums: optimum Let S(A) represent the sum of elements in set A of size n. We shall cal ...
- JavaPersistenceWithHibernate第二版笔记Getting started with ORM-001用JPA和Hibernate实现HellowWorld(JTA、Bitronix)
一.结构 二.model层 1. package org.jpwh.model.helloworld; import javax.persistence.Entity; import javax.pe ...
- 使用 tar 命令管理存档文件
tar命令用于将大型文件集汇集为一个文件(存档) tar的三种操作:c(创建存档).t(列出存档的内容).x提取存档 tar的常用选项:f(要操作的存档文件名).v(可视化操作) 创建压缩的tar存档 ...
- Sql server cast(as nvarchar) 默认长度问题
Sql server 在我的SQL语句中:sql=".........cast(ziduan as nvarchar) ..............." 这样之后,ziduan被转 ...
- Oracle ->> 连续聚合
select id, grp_factor, sum (id) over( partition by grp_factor order by id rows between unbounded pre ...
- 短信发送AZDG加密算法
public static string passport_encrypt(string txt, string key) { // 使用随机数发生器产生 ...