zoukankan      html  css  js  c++  java
  • js 学习笔记---BOM

    window对象

    1、 window 对象是Global对象,在全局作用域中声明的变量和函数都可以通过window.来访问。跟直接在window上添加属性效果一样。唯一的区别就是delete时,如果是全局变量会返回false,而window的属性会返回true(但是变量依然存在,跟没删除没区别)。所以,全局变量不可以delete,只有局部变量可以通过delete销毁。

    2、尝试访问未定义的变量时会抛出异常,但是可以通过window进行异常属性查询。

    3、top永远表示最外层框架,parent是直接上级,有时等于top,window是窗口本身始终=self。有时top=parent=window=self;

    4、窗口位置:firefox中是screenX和screenY,其他浏览器中是screenLeft和screenTop。但是在IE和opera中保存的是可视区域相对于屏幕的位置,而其他浏览器则是浏览器相对于屏幕的位置。会有 0,0。

    5、窗口大小:跨浏览器确定一个窗口的大小不是一件简单的事。innerWidth,innerHeight,outerWidth,outerHeight有的浏览器返回相同的值,有的是窗口可可视区域的值。但是可以跨浏览器确定可视区域的大小。(IE中有4像素的差别,长宽都会)。

    6、定时执行:间歇和超时调用,setInterval()对应clearInterval(); setTimeout()对应clearTimeout(); 建议少使用间歇调用,因为后一个间歇调用可能会在前一个间歇调用结束前执行(如果调用执行时间过长),可以通过setTimeout实现间歇调用的效果。

    7、通过window.print()和window.find()可以实现打印和查找的功能。

    location对象

    属性:host=‘www.baidu.com:80’,hostname='www.baidu.com' ,href = 'http://www.baidu.com' pathname='/wp/' port='8080',protocol ='http',search='?p1=v1&p2=v2'
    页面跳转:1、location.href='http://...' 2、window.location = URL 3、location.assign(URL); 4、location.replace(URL)(不会添加到历史记录,不能后退)。5、location.reload()重新加载,如果传入true则强制从服务器刷新。

    navigator对象

    认为比较能用到的属性:cookieEnabled,javaEnabled(),onLine(是否连接到了互联网)platform(浏览器所在的系统平台)

    screen对象

    screen.height和screen.width电脑屏幕的宽度和高度(像素)

    history对象

    主要用来前进后退,history.go(-1),history.back();history.forward();;

    测试代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <style>
    	*{ padding:0px; margin:opx;
    	 
    	}
    </style>
    </head>
    
    <body>
    <script type="text/javascript" language="javascript">
    	var age  =10;
    	function sayAge(){
    		alert(this.age);
    		var v = {id:23,name:'www'};
    		alert(v.id+' : '+ v.name);
    		delete v.id;
    		alert(v.id+' : '+ v.name);
    	}
    	window.sayAge();
    	window.name = 'wch';
    	alert(delete window.age);
    	alert(delete window.name);
    	alert(delete age);
    	alert(window.age + ' : '+ window.name);
    	
    	if(v){  // 异常
    		alert('错误!');
    	}
    	if(!window.v){
    		alert('进行一次属性查询,如果未定义就不会跑异常了!');
    	}
    	
    	alert(top == parent);
    	alert(top == window.parent.parent);
    	alert(top == self);
    	
    	var leftPos = (typeof window.screenLeft == 'number') ? window.screenLeft : window.screenX;
    	var topPos = (typeof window.screenTop == 'number' ) ? window.screenTop : window.screenY;
    	alert(leftPos + ' : '+ topPos);
    	
    	var pageWidth = window.innerWidth;
    	var pageHeight = window.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);
    	
    	alert(location.href + ' : '+location.search+' : '+ location.port);
    	
    	alert(navigator.cookieEnabled + ' : '+ navigator.javaEnabled()+' : '+navigator.onLine +' : '+navigator.platform)
    	
    	alert(screen.height + ' : '+screen.width)
    </script>
    </body>
    </html>
    


  • 相关阅读:
    获取Windows DPI
    你的float用对了吗
    Overhead of a .NET array
    【原】灵活运用sessionStorage或者localStorage
    【总结】总结写了3个React页面后遇到的各种坑
    【学】AngularJS日记(4)- 过滤器的使用
    【学】AngularJS日记(3)- $apply(), run()方法
    【学】AngularJS日记(2)
    【学】AngularJS日记(1)
    【学】React的学习之旅7-官方例子总结
  • 原文地址:https://www.cnblogs.com/vvch/p/4027581.html
Copyright © 2011-2022 走看看