zoukankan      html  css  js  c++  java
  • js window对象

    javascript之window对象 : http://www.cnblogs.com/kissdodog/archive/2013/01/01/2841464.html

    http://www.360doc.com/content/10/0915/16/3200988_53867835.shtml

    http://www.cnblogs.com/kangxuebin/articles/3080892.html 

    浏览器对象模型(Browser Object Model (BOM))

    Window 对象

    所有浏览器都支持 window 对象。它表示浏览器窗口。

    所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

    全局变量是 window 对象的属性。

    全局函数是 window 对象的方法。

    甚至 HTML DOM 的 document 也是 window 对象的属性之一:

    Window 尺寸

    • window.innerHeight - 浏览器窗口的内部高度
    • window.innerWidth - 浏览器窗口的内部宽度

    对于 Internet Explorer 8、7、6、5:

    • document.documentElement.clientHeight
    • document.documentElement.clientWidth

    或者

    • document.body.clientHeight
    • document.body.clientWidth
    var w=window.innerWidth
    || document.documentElement.clientWidth
    || document.body.clientWidth;

    var h=window.innerHeight
    || document.documentElement.clientHeight
    || document.body.clientHeight;
     

    window对象

    一、window的属性

     name: 窗口的名称,由打开它的链接(<atarget=””>)或框架页(<frame name=””>)或某一个窗口调用的open()方法
    
    status: 窗口下面的状态栏所显示的内容。通过对window.status赋值,可以改变状态栏的显示
    
    opener: window.opener 返回打开本窗口的对象。如果这个窗口不是由其他窗口打开的,会返回undefined.
    
    self: 指窗口本身,例如最常用的window.self.close()和window.close()是一样的,关闭窗口
    
    parent: 返回窗口所属的父窗口
    
    top: 返回占据整个浏览器窗口的最顶端的框架页对象
    

    二、window的方法

     open(): 打开一个新窗口,方法内含有一些参数这里不细说。方法内的第一个参数:url,就是要打开的窗口的链接,第二个参数name,就是窗口名称比较常用,其他的不细说。
    
    close(): 关闭已打开的窗口
    
    blur(): 焦点从窗口移走时触发
    
    focus(): 窗口获得焦点时触发,
    
    moveBy():从当前位置水平移动窗体x个像素,垂直移动窗体y个像素,x为负数,将向左移动窗体,y为负数,将向上移动窗体。
    
    moveTo():移动窗体左上角到相对于屏幕左上角的(x,y)点,当使用负数做为参数时会把窗体移出屏幕的可视区域。
    
    scrollTo: scrollTo(x,y) 使窗口从左上角开始数,移动到坐标为x,y的位置
    
    scrollBy(): scrollBy(x,y),使窗口从现在位置开始数,向右移动x像素,向下移动y像素,如果是负数,那么向相反的方向移动
    
    resizeTo(): resizeTo(w,h),使窗口移动到宽度为w,高度为h的大小
    
    resizeBy(): resizeBy(w,h),使窗口宽度增大w,高度增大h
    
    alert(): 不必细说,弹出一个含有“确定”按钮的窗口,这个时候script会暂停运行,直到点击“确定”按钮
    
    confirm(): 弹出含有“确定”和“取消”的窗口,点击“确定”返回true,点击“取消”返回false
    
    prompt(): 返回带有输入框以及“确定”和“取消”的按钮的一个窗口。
                  prompt("请在下面输入你的姓名", "撼地神牛");
    
    var wroxWin = window.open("http://www.wrox.com/","wroxWindow","height=400,width=400,top=10,left=10,resizable=yes");
    
    wroxWin.resizeTo(500,500);
    
    wroxWin.moveTo(100,100);
    
    wroxWin.close();
    
    alert(wroxWin.closed);     //true
    

    wroxWin.opener = window;

    时间等待与间隔函数:

    1、setTimeout()、clearTimeout()  在指定的时间后调用函数

      语法:

    • setTimeout(fun,time);  fun:函数体或函数名,time指定时间,单位为毫秒。
    • clearTimeout(id);  取消指定的setTimeout函数将要执行的代码
    setTimeout(function () {
            document.write("隔3秒后触发");   
        }, 3000)    //在3秒后输出
    
        setTimeout(fun1, 5000);     //在5秒后输出
        function fun1() {
            document.write("函数名的方式5秒后触发");
        }
    

     2、setInterval()、clearInterval(value)  在间隔指定的事件后重复调用函数

      语法:

    • setInterval(fun1,time)  fun:函数体或函数名,time指定的时间,单位为毫秒。会返回一个值,这个值是统计该函数的个数用的,第一个是1,第二个就是2,指明是第几个setInterval函数。
    • clearInterval(value)    value:setInterval()函数返回的值,根据这个值可以停止setInterval()的重复。 
    var i = 0;
    var h = setInterval(function () {
        document.write("3秒输出一次<br/>");
        i++;
        if (i >= 3) {
           clearInterval(h);
            document.write("停止输出");
        }
    }, 3000);
    
    function fn() { 
      setTimeout(function(){alert('can you see me?');},1000); 
      while(true) {} 
    } 
    
    alert();永远都不会执行,因为线程一直被死循环占用了。
    

    三、window的事件

     onload(): 窗口文档全部下载完毕时触发,一般写在body标签中,全部下载完意味着html文件、图片、控件都要下载完毕
    
    onunload: 当用户推出文档(关闭窗口或到另一个页面去)时触发,同onload()一样,要写到body标签内。
    
    onresize : 当窗口被调整大小的时候被触发
    
    onblur: 窗口失去焦点的时候触发
    
    onfocus: 窗口得到焦点的时候触发
    
    onerror: 当窗口内发生错误的时候触发(这个是比较有意思的)
    
    window.onerror= ignoreError;
    
    functionignoreError(){
    
    returnture;
    
    }
    
    这样就可以忽略窗口内一切错误。
    

    四、window的子对象

      window的主对象主要有如下几个:

    1. JavaScript document 对象
    2. JavaScript frames 对象
    3. JavaScript history 对象
    4. JavaScript location 对象
    5. JavaScript navigator 对象
    6. JavaScript screen 对象

    window.location子对象

          解析URL对象location

      location对象的属性有:href,protocal,host,hostname,port,pathname,search,hash

            document.write(location.href + "<br/>");        // http://localhost:4889/javascriptTest.html
            document.write(location.href);                   //http://www.runoob.com/js/js-window-location.html 
            document.write(location.protocol + "<br/>");    // http:
            document.write(location.host + "<br/>");        // localhost:4889
            document.write(location.hostname + "<br/>");    // localhost
            document.write(location.port + "<br/>");        // 4889
            document.write(location.pathname + "<br/>");    // /js/javascriptTest.html
            document.write(location.search + "换行<br/>");  //http://localhost:4889/javascriptTest.html?id=1&name=张三 如果路径是这样,则输出  ?id=1&name=%E5%BC%A0%E4%B8%89
            document.write(location.hash);                  //http: //localhost:4889/javascriptTest.html#kk=你好?id=1&name=张三 如果路径是这样,则输出  #kk=你好?id=1&name=张三
            window.location.assign("http://www.w3cschool.cc")  //加载新文档
    
    载入新文档
    
        location.reload()  重新加载页面
    
        location.replace()  本窗口载入新文档
    
        location.assign()   本窗口载入新文档
    
        location = "http://www.baidu.com"  //跳转到指定网址
    
        location = "search.html"        //相对路径跳转
    
        location = "#top"      //跳转到页面顶部
    

     window.history子对象

           window.history.length           浏览过的页面数

           window.history.back()           后退

           window.history.forward()         前进

           window.history.go(i)           浏览过的页面数

            history.go(-2);  后退两个历史记录

    window.screen子对象

           window.screen.width          屏幕宽度

           window.screen.height         屏幕高度

           window.availWidth             可用的屏幕宽度

           window.availHeight             可用的屏幕高度

     
    window.navigator子对象

        navigator.appName  Web浏览器全称

        navigator.appVersion  Web浏览器厂商和版本的详细字符串

        navigator.userAgent  客户端绝大部分信息

        navagator.platform   浏览器运行所在的操作系统

    js window对象常用

    function scrollleft()
    {
       var tle=document.title;
       var first=tle.charAt(0);
       var last=tle.substring(1,tle.length);
       //获取当前的titile文本
       document.title=last+first;
    }
     
    //可以重复循环
     setInterval("scrollleft()",500);
     clearInterval(10000);
     //只执行一次
     setTimeout("scrollleft()",500);
     clearTimeout(10000);
    // <body onbeforeunload="window.event.returnValue='hello'">  弹出对话框,是否关闭当前页面
    //跳转到该页面
     navigate(http://www.baidu.com);
     //获取当前浏览器的地址,设置当前浏览器的地址
      location.href=http://www.baidu.com;
      //页面刷新
      window.location.reload();
      //判断是否按下某个键
      if(window.event.altKey) 
      {
        alert("alt");
      }
      else
      {
       alert("otherkey");
      }
      //禁止数据提交
      onclick=alert("数据错误");window.event.returnValue=false;
      //判断屏幕分辨率
       
      if(screen.width<1024 || screen.height<768)
      {
         alert("分辨率太低,无法正常显示!");
      }
      //操作剪贴板
      clipboardData.getData("Text");
      clipboardData.setData("Text",val);
      clipboardData.clearData("Text");
      //前进后退
      window.history.back();
      window.history.forward();
      window.history.go(-1);
      window.history.go(1);
       
      //用于嵌套javascript脚本,广告
      document.write()
    

     js刷新页面方法大全:http://www.jb51.net/article/14397.htm

     
     
     
  • 相关阅读:
    【转载】 opencv, PIL.Image的彩色图片维度 && caffe和pytorch的矩阵维度
    【转载】 Caffe BN+Scale层和Pytorch BN层的对比
    【转载】 Pytorch中的学习率调整lr_scheduler,ReduceLROnPlateau
    【转载】 Pytorch(0)降低学习率torch.optim.lr_scheduler.ReduceLROnPlateau类
    【转载】 PyTorch学习之六个学习率调整策略
    【转载】 Pytorch(1) pytorch中的BN层的注意事项
    【转载】 【caffe转向pytorch】caffe的BN层+scale层=pytorch的BN层
    硬件设计之串口收发器---ISO1050 (现行) 隔离式 5V CAN 收发器
    外盘和内盘
    工业级别sd卡存贮slc mlc tlc
  • 原文地址:https://www.cnblogs.com/zhuiluoyu/p/4628285.html
Copyright © 2011-2022 走看看