您的位置：首页 > Web前端 > JavaScript

三、JS【JavaScript弱类型的脚本语言之BOM】05

2017-10-02 21:49 218 查看

1.BOM(Browser Object Model)浏览器对象模型

浏览器对象模型中把浏览器的各个部分都是用了一个对象进行描述，如果我们要操作浏览器的一些属性，

我就可以通过浏览器对象模型的对象进行操作。

1)学习三个对象

window:代表了一个新开的窗口。
location:代表了地址栏对象。
screen:代表了整个屏幕的对象。

2.window对象常用的方法

open() 打开一个新的窗口。----工具类、地址栏、顶部
A.如：
function showAd(){
open("a.html","_blank","height=400px,toolbar=no,location=no,top="300px");
}

setInterval() 没经过指定毫秒值后就会执行指定的代码。【持续】

clearInterval()根据一个任务的ID取消的定时任务。

setTimeout() 经过指定毫秒值后执行指定的代码一次。【一次】

-------【以下三个已经没有作用。】
resizeTo() 将窗口的大小更改为指定的宽带和高度值。
moveBy() 【相对于原来】的窗口移动指定的x、y值。
moveTo() 将【窗口左上角的屏幕位置】移动到指定的x和y位置。

3)注意事项：使用window对象的任何属性与方法都可以省略window对象不写。

事件（window）

1)注册的方式

A.方式1：直接在html元素上注册。如
<body onload="one()"> </body>
function one(){
--------
}
B.方式2：可以js代码向找到对应的对象再注册。推荐使用。
<body id="two"> </body>
var bodyNode=document.getElementById("two");
bodyNode.onload=function(){
--------
}

2)常用的事件------【Test03】

A.鼠标点击相关：
onclick 在用户用鼠标左键单击对象时触发。
ondblclick 在用户双击对象时触发。
onmousedown 当用户用【任何鼠标】按钮单击对象时触发。
onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。

B.鼠标移动相关：
onmouseout 当用户将鼠标指针移除对象边界时触发。【离开边界】
onmousemove 当用户将鼠标划过对象时触发。【经过】

C.焦点（鼠标箭头）
onblur 在对象失去输入焦点时触发。
onfocus 当对象获得焦点时触发。

D.其他
onchange 当对象或选中区的内容改变时触发。【内容改变】
onload 在浏览器完成对象的装载后立即触发。
onsubmit 当表单将要被提交时触发。

3.location（地址栏）

1)url属性如：location.url----------undefined

href---设置以及获取地址栏的对象

reload()---刷新当前的页面

2)代码

function showURL(){

//alert(location.url); //undefined
alert(location.href); //长串

}

function load(){

location.href="http://www.baidu.com"; //点击【最新网址】进入百度

}

function refresh(){

location.reload();

}

window.setInterval("refresh()",2000); //每两秒刷新一次页面。

4.screen（屏幕对象）

1)availHeight 获取系统屏幕的工作区域高度，排除Microsort Windows 任务栏

availWidth ----------------------宽度

height获取屏幕的垂直分辨率
width获取屏幕的水平分辨率

2)代码

document.write("获取系统屏幕的工作区域高度："+screen.availHeight+"</br/>");

document.write("获取系统屏幕的工作区域宽度："+screen.availWidth+"</br/>");

document.write("获取屏幕的垂直分辨率："+screen.height+"</br/>");
document.write("获取屏幕的水平分辨率："+screen.width+"</br/>");

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript BOM

相关文章推荐

新的分享

章节导航