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 ...
随机推荐
- php7 安装 及和php5的共存
http://blog.csdn.net/liuxinmingcode/article/details/50319145 LNMP FastCGI 是一个可伸缩地.高速地在HTTP server和动态 ...
- C#中的 序列化和反序列化
什么是序列化和反序列化? 序列化就是把一个对象保存到一个文件或数据库字段中去,反序列化就是在适当的时候把这个文件再转化成原来的对象使用. 我想最主要的作用有: 1.在进程下次启动时读取上次保存的对象的 ...
- 浏览器的CSS各种hack，大汇总
对着IE久了也有感觉了,在win10出新浏览器以及中国的IE6+用户没有普及新的浏览器前IE还是个坑,所以hack这东西还是要掌握一点的.不废话直接贴图 记得之前在项目里面针对IE6的hack是这样写 ...
- 【转】SQL Server T-SQL写文本文件
原文:http://www.nigelrivett.net/SQLTsql/WriteTextFile.html The are several methods of creating text fi ...
- 求一个全排列函数： 如p([1,2,3])输出：[123],[132],[213],[231],[312],[321]. 求一个组合函数 如p([1,2,3])输出：[1],[2],[3],[1,2],[2,3],[1,3],[1,2,3]
深度搜索的代码: #include<stdio.h> #include<string.h> ; int n; int a[Max]; bool b[Max]; void Dfs ...
- hdu 4111 Alice and Bob（中档博弈题）
copy VS study 1.每堆部是1的时候,是3的倍数时输否则赢: 2.只有一堆2其他全是1的时候,1的堆数是3的倍数时输否则赢: 3.其他情况下,计算出总和+堆数-1,若为偶数,且1的堆数是偶 ...
- [转]linux CentOS 安装 Nginx
网上找的教程,一路走下来的,原文如下: 一.安装nginx 1.在nginx官方网站下载一个包,下载地址是:http://nginx.org/en/download.html 2.Wi ...
- ajax：serialize() 获取表单集合
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 自由软件VS开源软件
自由软件VS开源软件 “自由软件运动”是一项倡导软件这种知识产品应该免费共享的社会运动,它主要是从社会伦理学,道德的高度,强调我们每个人都有自由使用软件的权利.这种权利不应该被软件私有所破坏. 反对软 ...
- 关闭Centos写磁盘功能
一个Linux文件默认有3个时间.atime:对此文件的访问时间. ctime:此文件inode发生变化的时间. mtime:此文件的修改时间. 如果有多个小文件(比如Web服务器的页面上有多个小图片 ...