javascript学习笔记(十四) window对象使用介绍


Posted in Javascript onJune 20, 2012

1.窗口位置
以下取得浏览器窗口距屏幕左边和上边的位置

var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX; //左边位置 
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY; //上边位置

2.浏览器大小
以下取得浏览器页面视口的大小
var pageWidth = window.innerWidth, 
pageHeight = window.innerHeight; if (typeof pageWidth != "number") { 
if (document.compatMode == "CSS1Compat") { 
pageWidth = document.documentElement.clientWidth; 
pageHeight = document.documentElement.clientHeight; 
} else { 
pageWith = document.body.clientWdith; 
pageHeight = document.body.clientHeight; 
} 
}

3.打开或弹出窗口
window.open()方法,可以接受4个参数,通常只需指定第一个参数,第一个参数为URL,第二个参数为_self 、_parent 、_top 、_blank 或者框架名
window.open("http://www.baidu.com"); 
window.open("http://www.baidu.com","_blank"); 
window.open("http://www.baidu.com","topFrame","height=400,width=400,top=10,left=10,resizable = yes"); 
topFrame.resizeTo(500,300); //调整窗口大小 
topFrame.moveTo(100,100); //移动窗口位置 
topFrame.close(); //关闭新打开的窗口,IE会报错

4.location 对象
location.href(URL) 加载URL
location.href(URL) 加载URL 
location.href("http://www.baidu.com"); 
location.href = "http://www.baidu.com" ; //同上 
location.assign = "http://www.baidu.com"; //同上 
window.loaction = "http://www.baidu.com"; //同上 
location.replace("http://www.baidu.com"); //同上,但不能回退 location.reload(); //重新加载(可能从缓存中加载) 
location.reload(true); //重新加载(从服务器中加载) 
location.search() 返回URL中的查询字符串,字符串以为?开头

5.获取查询字符串参数
function getQueryStringArgs() { 
var qs = (location.search.length > 0) location.search.substring(1) : ""; 
var args ={}; 
var items = qs.split("&"); 
var item = null,name = null,value = null; 
for (var i=0 ; i<items.length ; i++) 
{ 
item = itmes[i].split("="); 
name = decodeURIComponent(item[0]); 
value = decodeURIComponent(item[1]); 
args[name] = value; 
} 
return args; 
} //假设查询字符串参数是?q=javascript&num=10 
var args = getQueryStringArgs(); 
alert(args["q"]); //"javascript" 
alert(args["num"]); //"10"

6.history 对象
history.go()页面跳转 
history.go(-1); //后退一页 
history.go(1); //前进一页 
history.go(2); //前进两页 
history.go("baidu.com"); 跳转到最近的baidu.com页面 history.back(); //后退一页 
history.forword(); //前进一页

检测当前页是不是用户打开的第一个页面
if (history.length == 0) { 
//如果打开的是第一个页面的话,执行某些操作 
}

7.页面加载
window.onload() 用于页面加载结束后做某些操作
window.onload = function () { 
//执行某些操作 
}
Javascript 相关文章推荐
d3.js实现简单的网络拓扑图实例代码
Nov 06 Javascript
node.js(express)中使用Jcrop进行图片剪切上传功能
Apr 21 Javascript
javascript过滤数组重复元素的实现方法
May 03 Javascript
angularjs封装$http为factory的方法
May 18 Javascript
基于vue开发的在线付费课程应用过程
Jan 25 Javascript
vue实现个人信息查看和密码修改功能
May 06 Javascript
JS函数节流和防抖之间的区分和实现详解
Jan 11 Javascript
layui表格内放置图片,并点击放大的实例
Sep 10 Javascript
js回溯法计算最佳旅行线路代码实例
Sep 11 Javascript
详解简单易懂的 ES6 Iterators 指南和示例
Sep 24 Javascript
electron-vue开发环境内存泄漏问题汇总
Oct 10 Javascript
vue keep-alive 动态删除组件缓存的例子
Nov 04 Javascript
javascript学习笔记(十三) js闭包介绍(转)
Jun 20 #Javascript
javascript学习笔记(十二) RegExp类型介绍
Jun 20 #Javascript
javascript学习笔记(十一) 正则表达式介绍
Jun 20 #Javascript
javascript学习笔记(十) js对象 继承
Jun 19 #Javascript
javascript学习笔记(九) js对象 设计模式
Jun 19 #Javascript
javascript学习笔记(八) js内置对象
Jun 19 #Javascript
javascript学习笔记(七) js函数介绍
Jun 19 #Javascript
You might like
php中生成随机密码的自定义函数代码
2013/10/21 PHP
thinkphp5修改view到根目录实例方法
2019/07/02 PHP
thinkphp 5框架实现登陆,登出及session登陆状态检测功能示例
2019/10/10 PHP
javascript之函数直接量(function(){})()
2007/06/29 Javascript
JavaScript 密码强度判断代码
2009/09/05 Javascript
js 中的switch表达式使用示例
2020/06/03 Javascript
js中AppendChild与insertBefore的用法详细解析
2013/12/16 Javascript
iframe调用父页面函数示例详解
2014/07/17 Javascript
使用jQuery制作Web页面遮罩层插件的实例教程
2016/05/26 Javascript
JavaScript中的toString()和toLocaleString()方法的区别
2017/02/15 Javascript
webpack打包node.js后端项目的方法
2018/03/10 Javascript
如何利用@angular/cli V6.0直接开发PWA应用详解
2018/05/06 Javascript
python 从远程服务器下载日志文件的程序
2013/02/10 Python
Python获取Windows或Linux主机名称通用函数分享
2014/11/22 Python
Python3爬虫之urllib携带cookie爬取网页的方法
2018/12/28 Python
python三引号输出方法
2019/02/27 Python
对Django中的权限和分组管理实例讲解
2019/08/16 Python
python将数组n等分的实例
2019/12/02 Python
python创建ArcGIS shape文件的实现
2019/12/06 Python
Python 定义只读属性的实现方式
2020/03/05 Python
关于Python错误重试方法总结
2021/01/03 Python
不同浏览器对CSS3和HTML5的支持状况
2009/10/31 HTML / CSS
html5版canvas自由拼图实例
2014/10/15 HTML / CSS
HTML5基于flash实现播放RTMP协议视频的示例代码
2020/12/04 HTML / CSS
西班牙在线光学:Visual-Click
2020/06/22 全球购物
消防标语大全
2014/06/07 职场文书
大学毕业生管理学求职信
2014/09/01 职场文书
简易离婚协议书范本
2014/10/24 职场文书
2015年实习班主任工作总结
2015/04/23 职场文书
2015年政务公开工作总结
2015/05/19 职场文书
高效课堂教学反思
2016/02/24 职场文书
蓝天保卫战收官在即 :15行业将开展环保分级评价
2019/07/19 职场文书
修辞手法有哪些?
2019/08/29 职场文书
python 逐步回归算法
2021/04/06 Python
python中if和elif的区别介绍
2021/11/07 Python
springboot集成redis存对象乱码的问题及解决
2022/06/16 Java/Android