JS window

来源：互联网发布：黄金家族软件下载编辑：程序博客网时间：2024/06/05 22:56

最近在学习JS，可能文档里面的东西都是我从别处拷贝和总结过来的，希望原著不要介意啊，我只是学习完了后，喜欢自己留个笔记而已，在以后不会或者遇到同样的问题自己查阅方便而已。

浏览器对象模型（BOM）是js能与浏览器对话。而且BOM目前尚无正式标准，由于现代浏览器几乎实现了js交互性方面的相同方法和属性，因此常被认为是BOM的方法和属性。

1,JS Window

1)Window对象，所有的浏览器都支持window对象，它支持浏览器窗口，所有的js全局对象，函数以及变量都能自动成为window对象的成员，全局变量是window对象
的属性，全局函数是window对象的方法。甚至基于Html DOM的document也是window对象的属性之一，window.document.getElementById('demo');
等价于:document.getElementById('demo');
2)window尺寸，不同的浏览器支持不同，但是总共就这三方式。
var w=window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var h=window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
3)其他的window方法：
    window.open() - 打开新窗口
    window.close() - 关闭当前窗口
    window.moveTo() - 移动当前窗口
    window.resizeTo() - 调整当前窗口的尺寸

2，JS Screen

window.screen对象在编写时候，可以不使用window这个前缀。
screen.availWidth:可用屏幕宽度
screen.availHeight:可用屏幕高度

3，Window Location

window.location对象在编写时候，可以不使用location这个前缀。
   location.hostname:返回web主机的域名。
   location.pathname:返回当前页面的路径和文件名。
   location.port:返回web主机的端口。
   location.protocol:返回web主机的端口。
   location.href:返回当前页面的URL
   location.assign(url):加载新的文档或者新的页面。

4,Window History

window.history对象在编写的时候可以不使用window这个前缀，为了保护用户隐私，对象对js访问该对象做出了限制。
history.back():与在浏览器点击后退按钮相同
history.forward():与在浏览器中点击按钮向前相同

5,JS Navigator 对象包含有关访问者浏览器的信息。

window.navigator 对象在编写时可不使用 window 这个前缀。

对象属性：appCodeName 返回浏览器的代码名。appMinorVersion 返回浏览器的次级版本。appName 返回浏览器的名称。appVersion 返回浏览器的平台和版本信息。browserLanguage 返回当前浏览器的语言。cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值。cpuClass 返回浏览器系统的 CPU 等级。onLine 返回指明系统是否处于脱机模式的布尔值。platform 返回运行浏览器的操作系统平台。systemLanguage 返回 OS 使用的默认语言。userAgent 返回由客户机发送服务器的 user-agent 头部的值。userLanguage 返回 OS 的自然语言设置。对象方法：javaEnabled()     规定浏览器是否启用 Java。taintEnabled()     规定浏览器是否启用数据污点 (data tainting)。

6，Js PopupAlert，js提供的三种消息框，暂时省略。

7，Js Timing

通过js，我们有能力做到一个在设定的时间间隔之后来执行代码，而不是在函数被调用后执行，我们称之为计时事件。
通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。在 JavaScritp 中
使用计时事件是很容易的，两个关键方法是:
setTimeout() 未来的某时执行代码
clearTimeout() 取消setTimeout()
eg:开始和停止计时

<html><head>    <script type="text/javascript">        var c=0        var t        function timedCount()        {            document.getElementById('txt').value=c            c=c+1            t=setTimeout("timedCount()",1000)        }        function stopCount()        {            c=0;            setTimeout("document.getElementById('txt').value=0",0);            clearTimeout(t);        }    </script></head><body>    <form>        <input type="button" value="开始计时！" onClick="timedCount()">        <input type="text" id="txt">        <input type="button" value="停止计时！" onClick="stopCount()">    </form>    <p>请点击上面的“开始计时”按钮来启动计时器。输入框会一直进行计时，从 0 开始。点击“停止计时”按钮可以终止计时，并将计数重置为 0。</p></body></html>

eg:使用计时器制作钟表

<html><head>    <script type="text/javascript">    function startTime()    {        var today=new Date()        var h=today.getHours()        var m=today.getMinutes()        var s=today.getSeconds()        // add a zero in front of numbers<10        m=checkTime(m)        s=checkTime(s)        document.getElementById('txt').innerHTML=h+":"+m+":"+s        t=setTimeout('startTime()',500)    }    function checkTime(i)    {        if (i<10)          {i="0" + i}          return i    }    </script></head><body onload="startTime()">    <div id="txt"></div></body></html>

8，JS cookies
cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。
eg:

<html><head>    <script type="text/javascript">    function getCookie(c_name) {        if (document.cookie.length>0) {              c_start=document.cookie.indexOf(c_name + "=")              if (c_start!=-1) {                c_start=c_start + c_name.length+1                c_end=document.cookie.indexOf(";",c_start)                if (c_end==-1) c_end=document.cookie.length                return unescape(document.cookie.substring(c_start,c_end))                }          }        return ""    }    function setCookie(c_name,value,expiredays) {        var exdate=new Date()        exdate.setDate(exdate.getDate()+expiredays)        document.cookie=c_name+ "=" +escape(value)+        ((expiredays==null) ? "" : ";expires="+exdate.toGMTString())    }    function checkCookie() {        username=getCookie('username')        if (username!=null && username!="") {            alert('Welcome again '+username+'!')        }        else {          username=prompt('Please enter your name:',"")          if (username!=null && username!="") {            setCookie('username',username,365)            }          }    }    </script></head><body onLoad="checkCookie()"></body></html>

阅读全文

0 0