没有合适的资源?快使用搜索试试~ 我知道了~
BOM的用法介绍.docx
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 15 浏览量
2022-07-08
11:42:49
上传
评论
收藏 50KB DOCX 举报
温馨提示
试读
16页
BOM的用法介绍.docx
资源推荐
资源详情
资源评论
BOM 教程
什么是 BOM
�
BOM 是 browser object model 的缩写,简称浏览器对象模型
�
BOM 提供了独立于内容而与浏览器窗口进行交互的对象
�
由于 BOM 主要用于管理窗口与窗口之间的通讯,因此其核心对象是window
�
BOM 由一系列相关的对象构成,并且每个对象都提供了很多方法与属性
�
BOM
缺乏标准,
JavaScript
语法的标准化组织是
ECMA
,
DOM
的标准化组织是
W3C
�
BOM 最初是 Netscape 浏览器标准的一部分
在 BOM 章节中你将学到什么
BOM 教程中,同学们将学到与浏览器窗口交互的一些对象,例如可以移动,调整
浏览器大小的 window 对象,可以用于导航的 location 对象与 history 对象,可
以获取浏览器,操作系统与用户屏幕信息的 navigator 与 screen 对象,可以使用
document 作为访问 HTML 文档的入口,管理框架的 frames 对象等
BOM 结构图
window 对象是 BOM 的顶层(核心)对象,所有对象都是通过它延伸出来的,也可
以称为 window 的子对象。
由于window 是顶层对象,因此调用它的子对象时可以不显示的指明window 对象,
例如下面两行代码是一样的:
document.write("www.dreamdu.com");
window.document.write("www.dreamdu.com");
window 对象
-- window 对象是 BOM 中所有对象的核心
�
window ,中文"窗口"的意思
�
window 对象除了是 BOM 中所有对象的父对象外,还包含一些窗口控制函数
全局的 window 对象
JavaScript 中的任何一个全局函数或变量都是 window 的属性
示例
var sTest="dreamdu";
document.write(sTest==window.sTest);
结果:
true
由于 sTest 是全局变量,因此可以通过 window.sTest 访问这个变量。
window 与 self 对象
self 对象与 window 对象完全相同,self 通常用于确认就是在当前的窗体内。
window 的子对象
�
JavaScript document 对象
�
JavaScript frames 对象
�
JavaScript history 对象
�
JavaScript location 对象
�
JavaScript navigator 对象
�
JavaScript screen 对象
window 函数
窗体控制函数
�
JavaScript moveBy() 函数
�
JavaScript moveTo() 函数
�
JavaScript resizeBy() 函数
�
JavaScript resizeTo() 函数
窗体滚动轴控制函数
�
JavaScript scrollTo() 函数
�
JavaScript scrollBy() 函数
窗体焦点控制函数
�
JavaScript focus() 函数
�
JavaScript blur() 函数
focus -- focus,中文"焦点"的意思。使窗体或控件获取焦点
focus 函数语法
focus();
示例
function setblur()
{
dreamdutxt.focus();
dreamdutxt.blur();
}
<input type="button" value="获得焦点" onclick="javascript:dreamdutxt.focus()" />
<input type="button" value="失去焦点" onclick="setblur()" />
<input type="text" value="text" name="dreamdutxt" onblur="alert('dreamdutxt is
onblur')" />
使控件失去与获得焦点
blur -- blur,中文"模糊的意思。与 focus 函数相反,使窗体或控件失去焦点
blur 函数语法
blur();
函数说明:可以使用 blur 函数是窗体或空间失去焦点,例如当按钮处于焦点状
态下时,会有虚线框,使用 blur 函数可以去除焦点,从而使虚线框消失
示例
<a href="#" onfocus="blur()">去除链接上的虚线框,点击链接测试</a>
去除链接上的虚线框,使用 blur 函数
新建窗体函数
�
JavaScript open() 函数
�
JavaScript close() 函数
�
JavaScript opener 属性
open -- 打开(弹出)一个新的窗体
open 函数语法
window.open(url, name, features, replace);
open 函数参数说明
�
url -- 要载入窗体的 URL
�
name -- 新建窗体的名称(也可以是 HTML target 属性的取值,目标)
�
features -- 代表窗体特性的字符串,字符串中每个特性使用逗号分隔
�
replace -- 一个布尔值,说明新载入的页面是否替换当前载入的页面,此参数通常不
用指定
open 函数 name 参数说明
name 用于设置弹出窗体的名称,如果使用已有的窗体或框架名称作为 name 参数,
那么 url 网址将在这个窗体或框架页面载入
例如:
<a href="page1.html" target="newWin"> 使用 HTML 连接建立一个页面</a>
<a href="#" onclick="window.open('page2.html', 'newWin');">使用 JavaScript 在上面已经
建立连接的页面载入 HTML 教程</a>
首先使用普通 HTML 链接打开一个页面(target 名为 newWin),之后使用 open 函
数打开另一个页面,浏览器首先要查找是否有名称为 newWin 的窗体,如果有,
就在这个窗体中加载 page2.html。否则新建一个名称为 newWin 的窗体并加载
page2.html
剩余15页未读,继续阅读
资源评论
Cheng-Dashi
- 粉丝: 108
- 资源: 1万+
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功