js BOM

BOM

概念：bom browser object model

1 常用对象

Window:窗口，浏览器的窗口

我们定义的全局变量的全局函数都是Window对象的属性和方法

浏览器boby的宽度：window.ininerWidth

浏览器boby的高度：window.ininerHeight;

常用的方法：

Open：打开一个新的浏览器，要传三个参数，第一个为将要打开浏览器的路径第二个为打开的方式第三个为打开的新的浏览器的设置大小。

myWindow=window.open("https://www.baidu.com/","_blank");

close：关闭窗口

myWindow.close();

moveto：移动一个窗口。以左上角为坐标点

function moveWin(){
    myWindow.move(200,300);
    myWindow.focus();

}

focus();使窗口获得焦点

resizeto：改变窗口的大小

screen：屏幕  也是window下面的一个对象在使用的时候可以用Window.screen。

屏幕的常用的属性：宽和高：可用宽和高（不包括导航栏）

var scrwidth =window.screen.width;
var scrheihth =window.screen.height;
    document.write("宽"+scrwidth+"高"+scrheihth);
    varscrAviwidth  =  screen.availWidth;
    varscrAviheihth  =  screen.availHeight;
document.write("宽"+scrAviwidth+"高"+scrAviheihth);

localtion：地址

href完整路径 port端口号 pathname路径名 protocol：协议

var href =location.href;
    document.write(href);
    varport = location.port;
    document.write(port);
    varpath = location.pathname;
    document.write(path);
    varpro = location.protocol;
    document.write(pro);

常用方法：

Assign：打开一个新的窗口

location.assign("https://baidu.com");

刷新：普通刷新和强制刷新

location.reload();

参数为true是强制刷新，否则反之。

History：历史记录

记录当前窗口的历史，可以进行页面的转换

Back:返回上一页

Forward：进入下一页

To：进入确切的哪一页（-1时为返回上一页）

2 弹窗

Alert（）警告提示框。也是window对象的方法Window可以省略不写

Prompt（“提示的信息”，默认值）：信息提示框。也是window对象

var str = prompt("asdad","dsds");

confirm（）：确定框  当你点击 "确认", 确认框返回 true， 如果点击 "取消", 确认框返回 false。

<button onclick="fun1()"></button>
<p id="p1">x</p>

</body>
<script type="application/javascript">
/*var str = prompt("asdad","dsds");*/
function fun1(){
    var x = "";
    var r = confirm("确定或取消");
    if(r==true){
x="点击了确定"

    }else{
        x="点击了取消";
    }
  document.getElementById("p1").innerHTML=x;

}

3 cookie

Cookie的作用：在本地浏览器存储账号；

Cookie组成：

存储的数据：”idname=12314;pos=312231;”

有效期：expires=今天以后的时间

存储cookie：

function saveCookie(){
    var idname = document.getElementById("idname").value;
    var pos = document.getElementById("pos").value;

    var date=new  Date();
    date.setDate(date.getDate()+7);
    var cookieText="idname = "+idname+";"+ "expires=" +date;
    var cookiepos="pos = "+pos+";"+ "expires=" +date;
    document.cookie=cookieText;
    document.cookie=cookiepos;

}

获取cookie：通过document.cookie 就能得到浏览器之前存储的cookie。是一个字符串，将这个字符串进行解析得到自己想要的内容。

function getCookie(){
    var data = document.cookie;
    var result = [];
    result = data.split("; ");
    var userIdData = result[0].split("=")[1];
    var psdData = result[1].split("=")[1];

    var idname = document.getElementById("idname");
    idname.value = userIdData;
    var pos = document.getElementById("pos");
    pos.value = psdData;

}

清除cookie ：将已存储cookie的日期改为过期就清除了。

function reCookie(){
   var date = new Date();
    date.setDate(date.getDate()-7);
    var cookieText = "idname=;expires=" + date;

    document.cookie = cookieText;

}

4 计时事件

SetInterval（“函数”，“毫秒数”）；计时器就是每隔多少秒再进行。