JavaScript学习笔记之BOM
BOM的核心对象是window,它既表示浏览器窗口以及页面可见区域,同时也是ECMAScript中的Globe对象,所有的全局变量和函数都是它的属性,并且所有的原声函数以及其他函数也都存在于它的命名空间下。
一,window窗口相关设置
1)获取浏览器窗口在显示屏的位置
根据浏览器不同,可以采用screenLeft,screenTop或者screenX,screenY,跨浏览器的代码如下:
//获取浏览器的位置 var leftPos=(typeof window.screenLeft =='number')?window.screenLeft:window.screenX; var topPos=(typeof window.screenTop =='number')?window.screenTop:window.screenY;
2)移动浏览器窗口的位置
moveTo,moveBy.不过该方法一般浏览器是禁用的
3)获取浏览器窗口大小,以及浏览器页面视口的大耵浏览器窗口的大小
不同浏览器的实现方法不同,最终无法确定浏览器窗口本身的大小,但是可以取得页面视口的大小
//获取浏览器视口的位置
var pageWidth=document.innerWidth;
var pageHeight=document.innerHeight;
if(typeof pageWidth!="number"){
if(document.compatMode=="CSS1Compat"){
pageWidth=document.documentElement.clientWidth;
pageHeight=document.documentElement.clientHeight;
}else{
pageWidth=document.body.clientWidth;
pageHeight=document.body.clientHeight;
}
}
alert(pageWidth+","+pageHeight);
4)调整浏览器窗口大小
可以利用resizeTo()和resizeBy()两个方法,不过这个方法一般也是被禁用的。
二、window相关的全局对象
1.location对象
1)location即是window的属性,也是document的属性,代表当前页面的访问地址
2)locaiton可以通过host,href,pathname,protocol,search等属性,访问当前url地址的相关字段
3)location可以改变当前的访问地址。多采用location.href="新地址"
4)location.reload()重新加载页面
2.navigation对象
代表浏览器应用,可以查询浏览器的版本,名称等。在实际中应用不多。
3.history对象
该对象保存着用户的上网历史,history.go(-n),history.go(n),如果仅仅前进/后退一步,可以使用back(),forward(),来模仿浏览器的前进/后退操作。
三、window相关的全局函数
1.Math,Date等对象提供的相关工具函数
2.window.open()弹出框函数,该方法可以导航到一个特定的url,可以打开一个新的浏览器窗口,接受四个参数,URL,窗口目标,一个特性字符串("_self,_blank,_parent等"),以及是否在浏览器历史记录中记录当前加载页面的布尔值。有些时候,弹出窗会受限于浏览器的安全限制。
3.间歇调用和超时调用
setTimeOut():接受两个参数,函数以及经过多长时间后该函数被调用
setInterVal():接受两个参数,函数以及每间隔多长时候该函数被调用一次
4,系统相关对话框
alert(),confirm(),prompt()
这几个对话框的外观由浏览器决定,而不是由css决定,同时,这些对话框都是同步和模态的,也就是说,显示这些对话框的时候,代码会停止运行,直到关闭这些对话框。
JavaScript学习笔记之BOM的更多相关文章
- JavaScript学习笔记之BOM对象
目录 1.Window 2.Window Screen 3.Window Location 4.Window History 5.Window Navigator 浏览器对象模型(Browser Ob ...
- JavaScript学习笔记(13)——BOM
1.window 所有浏览器都支持window对象,它表示浏览器窗口本身. 所有 JavaScript 全局对象.函数以及变量均自动成为 window 对象的成员. 全局变量是 window 对象的属 ...
- Java程序猿的JavaScript学习笔记(汇总文件夹)
最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(2——复制和继承财产)
计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...
- Java程序猿的JavaScript学习笔记(3——this/call/apply)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(4——关闭/getter/setter)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- Java程序猿JavaScript学习笔记(14——扩大jQuery UI)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- javascript学习笔记(四) Number 数字类型
数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数 toExponential() 方法 用科学 ...
随机推荐
- nmap 高级扫描用法
nmap提供了四项基本功能(主机发现.端口扫描.服务与版本侦测.OS侦测)及丰富的脚本库.Nmap既能应用于简单的网络信息扫描,也能用在高级.复杂.特定的环境中:例如扫描互联网上大量的主机:绕开防火墙 ...
- Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.5:compile
mvn clean mvn install mvn clean -Dmaven.test.skip=true install 出现上述问题,找不到很多类的一些方法. 解决方法: 1.Window -- ...
- phantomjs 安装使用
PhantomJS 是一个基于 WebKit 的服务器端 JavaScript API.它全面支持web而不需浏览器支持,其快速,原生支持各种Web标准: DOM 处理, CSS 选择器, JSON, ...
- selenium 使用笔记
下面一段代码是使用selenium访问网页一个小实例 #!/usr/bin/python# -*- coding: utf-8 -*- '''Created on Dec 6, 2013 @autho ...
- [转]常用 Git 命令清单
作者: 阮一峰 我每天使用 Git ,但是很多命令记不住. 一般来说,日常使用只要记住下图6个命令,就可以了.但是熟练使用,恐怕要记住60-100个命令. 下面是我整理的常用 Git 命令清单.几个专 ...
- wordpress为dashboard添加样式
function my_admin_theme_style() { wp_enqueue_style('my-admin-style', get_template_directory_uri() . ...
- SSH 基础
什么是SSH? 传统的网络服务程序,如:ftp.pop和telnet在本质上都是不安全的,因为它们在网络上用明文传送口令和数据,别有用心的人非常容易就可以截获这些口令和数据.而且,这些服务程序的安全验 ...
- ie6 css sprites重复加载问题
_html{zoom:expression(function(ele){ele.style.zoom = "1";document.execCommand("Backgr ...
- C#调用NPOI组件导出Excel表格
把一个List集合的数据导出到Excel表格中 public static string RenderToExcel<T>(List<T> datas) { MemoryStr ...
- isset和empty比较
PHP的isset()函数 一般用来检测变量是否设置 格式:bool isset ( mixed var [, mixed var [, ...]] ) 功能:检测变量是否设置 返回值: 若变量不存在 ...