浏览器对象模型BOM总结
BOM
windows对象
document对象
location对象
screen对象 Windows对象 1.窗口操作 移动指定的距离：window.moveBy（10，20）; //向右移动10像素，向下移动20像素
移动到指定位置：window.moveTo(x,y);
修改窗口的高宽：window.resizeBy(x,y);
修改高宽为指定值：window.resizeTo(x,y); //移动窗口，使它的宽度调整为x，高度调整为y （IE）
取得窗口距屏幕位置(左、上)：
alert(window.screenLeft);
alert(window.screenTop);
客户区高宽：
alert(document.body.offsetWidth);
alert(document.body.offsetHeight); （Mozila）
窗口位置：
alert(window.screenX);
alert(window.screenY);
客户区高宽：
alert(window.innerWidth);
alert(window.innerHeight); 2.在新窗口打开链接（弹出窗口）
windows.open("URL","新窗口名字"，"新窗口特性"); eg.
定义一个显示名字为“打开”的按钮，当鼠标点击时打开窗口长度宽度为400px的名为x.html的网页 <input id="btn" type="button" value="打开"/>
<script type = "text/javascript">
var btn = document.getElementById("btn");
btn.onclick = functionZ(){
windows.open("x.html","","width=400px, height=400px");
};
</script> 3.系统对话框（控制用户行为）
window.alert("字符串"); //alert()方法 if(confirm(Are you sure?)){ //confirm()方法
alert("yes");
}else{
alert("no");
} var str = window.prompt("请输入姓名："，"张张"); //prompt()方法
alert(str); 4.状态栏（不专业，使用户厌烦）
window.defaultStatus = "测试数据"; //使状态栏的文本暂时改变
window.status = "test"; //用户离开当前页面时可以一直改变该文本 5.时间间隔和暂停（有效告诉浏览器何时执行某行代码）
var id=window.setTimeout("执行代码"，（间隔）毫秒数);
window.clearTimeout(id); var id=window.setInterval("执行代码"，（暂停，可不设）毫秒数)；
window.clearInterval(id); eg.
<input type="button" id="btn" value="开始"/>
<input type="text" size="60" id="txt1" />
<input type="button" id="btn2" value="暂停"/>
<script type="text/javascript">
var btn = document.getElementById("btn");
var btn2 = document.getElementById("btn2");
var txt = document.getElementById("txt1");
var r;
btn.onclick = function() {
function test() {
var day = new Date();
txt.value = day;
r = window.setTimeout(test, 3000);
}
test();
}; btn2.onclick = function () {
window.clearTimeout(r);
};
test();
</script> 6.历史
window.history.go(-1); //正前负后，数字为-1表示每次后退，只退一个页面
//window对象的引用不是必需的，也可使用history.go();
history.back(); //后退
history.forward(); //前进
页面数：
alert("在历史记录中有"+history.length+"页"); //在历史记录中有x页 document对象（代表窗口空白区域）
1.属性
页面的最后修改日期（用处不大）：lastModify
浏览历史中后退一个位置的URL（用处不大）:referrer
</title>标签中显示的文本（可读写）：title
当前页面的URL（可读写）：URL
eg.
alert(document.URL); 2.集合属性
页面中所有锚点的集合：anchors
eg.
<style type="text/css">
div {
height: 2000px;
}
</style>
</head>
<body>
<a name="a" href="#">锚点1</a>
<a name="a" href="#">锚点2</a>
<a href="#">锚点3</a>
<div></div>
<script type="text/javascript">
alert(document.anchors[0].innerHTML);
</script>
<a href="#a">回到顶部</a> 表单集合：forms
图片集合：images //可用document.images[0]或document.images["imageName"]
超链接集合：links 3.方法（整个页面的元素会重新设置，轻易不要使用）
write("");
writeln(""); location对象（表示载入窗口的URL）
1.解析URL
服务器名字：host
URL中主机名后的部分：pathname
端口：prot //大多数URL没有端口信息，所以通常是空白的
协议：protocol // URL中使用的协议，在（//）之前的部分
URL中问号后的部分：search
eg.
alert(location.search); 2.跳转到新页面
location.href="a.html"
location.assign("a.html");
location.replace("a.html"); //没有历史信息 3.刷新页面
location.reload(true); //从服务器刷新
location.reload(true); //从本地刷新 navigator对象（包含大量有关web浏览器的信息） //可用window.navigator引用它也可用navigator引用 保存跟浏览器相关信息
language
userAgent
onLine screen对象（获取某些有关用户屏幕的信息）
窗口可以使用的屏幕的高度：availHeight
窗口可以使用的屏幕的宽度：availWidth
颜色位数（大多数系统采用32位）：colorDepth
屏幕的高度：height
屏幕的宽度：width 全屏
window.moveTo(0,0);
window.resizeTo(screen.availWidth.screen.availHeight);
浏览器对象模型BOM总结的更多相关文章
- 浏览器对象模型BOM小结
概念 BOM (Browser Object Model) 浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window B ...
- 浏览器对象模型BOM
第二章 浏览器对象模型BOM 1.作用:操作窗口:提供导航对象:提供定位对象:浏览器上方的地址栏:提供跟屏幕相关对象:提供对Cookie的支持 2.根元素:window:代表整个窗口:window,o ...
- 浏览器对象模型BOM（Browser Object Model）
1.结构 BOM是Browser Object Model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是w ...
- JavaScript编程：浏览器对象模型BOM
4.浏览器对象模型BOM: document.body.offsetwidth可以获取浏览器宽度. Window对象: 窗口操作: 1.moveBy(dx,dy ...
- JavaScript 浏览器对象模型 (BOM)
浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”. 浏览器对象模型 (BOM) 浏览器对象模型(Browser Object Model)尚无正式标准. 由于现代浏览器已经 ...
- JavaScript高级程序设计（第3版）学习笔记·第8章——浏览器对象模型BOM
转自:http://www.shaoqun.com/a/43768.aspx 访问和操作浏览器窗口的模型称为浏览器对象模型BOM(Browser Object Model),但习惯上是把所有针对浏览器 ...
- 浏览器对象模型bom的作用是什么？
浏览器对象模型bom的作用是什么? 零.总结 1.BOM提供了独立于内容而与浏览器窗口进行交互的对象 2.BOM提供了一些访问窗口对象的一些方法,我们可以用它来移动窗口位置,改变窗口大小,打开新窗口和 ...
- 浏览器对象模型(BOM)是什么？（体系结构+知识详解）（图片：结构）
浏览器对象模型(BOM)是什么?(体系结构+知识详解)(图片:结构) 一.总结 1.BOM操作所有和浏览器相关的东西:网页文档dom,历史记录,浏览器屏幕,浏览器信息,文档的地址url,页面的框架集. ...
- js浏览器对象模型-BOM
bom browse object model 浏览器对象模型. 也就是window对象下面的东西. location 对象 window.location.href 表示打开窗口的路径. windo ...
- 浏览器对象模型(BOM)
BOM结构 用户浏览网页的时候,浏览器会自动创建一些对象,这些对象存放着浏览器窗口的属性和相关信息,也就是大家熟称的BOM.浏览器对象模型是一个层次化的对象集,我们可以通过window对象访问所有对象 ...
随机推荐
- js面向对象关键点
函数加new 工作流程: (1) 创建一个新对象: => var this = new Object(); (2) 将构造函数的作用域赋给新对象(因此 this 就指向了这个新对象) : (3) ...
- 构建Maven父子工程
IDEA构建maven父子工程: 1.打开IDEA,Create New Project 如图: 如果没有弹出新建界面,可以先 file-->Close Project 如图: 2.创建父 ...
- Javascript Date类型
Date 类型使用自 UTC 1970 年 1 月 1日 午夜 开始经过的毫秒数来保存日期. 创建日期对象 var now = new Date();//获取当前日期 Date.parse ...
- javaweb 与jsp页面的交互流程 (初次接触时写)
javaweb 与jsp页面的交互流程 javaweb项目目录 1. javaweb项目的一般目录: 2. jsp 页面一般情况下放在 top(前台页面) back(后台页面) 3. 后台代码 放在s ...
- CentOS7 安装 jexus-5.8.2-x64
前要提示: 如果你要安装asp.net 请参考: http://www.cnblogs.com/xiaoruilin/p/7867823.html 背景: CentOS7 Mono (Mono JIT ...
- 关于python列表和元组的基本操作
一.列表 列表是python中最常出现的一种数据存储形式,掌握列表的基本操作可以快速而有效的提高我们的代码书写效率.列表中存放的数据有如下基本操作:如增.删.改.查,掌握了这四个操作,就基本掌握了列表 ...
- Jmeter post请求传参问题
同线程组引用参数 举例1:新增数据bizId,然后将此次新增数据删除 添加新增数据接口,然后查询数据列表,正则表达式提取bizId 在删除接口引用此值${bizId} 添加断言,执行查看结果
- Charles 使用
一.设置域名焦点 View->Focused Hosts…-> 二.抓包https:配置证书 1. 电脑安装SSL证书 选择 “Help” -> “SSL Proxying” -&g ...
- Python的基本语法1
一.python的基本数据类型 (1)6种基本数据类型 1.数字类型 int 整数,2,0,-4等 float 浮点数,如1.2,-0.3等 bool 布尔类型,True,False complex ...
- cadence16.6 暴力破解出现再次安装出现问题为Sever-----------问题
根据本人,实测,本人研究几天和在网络上借鉴,此方法是几天的成果,如有借鉴,请说明出处,谢谢,不懂的请留言. 最优解决方式,是自己卸载软件,有人会说,都完全删除了还怎么卸载软件. (1)在安装包里有个注 ...