夏日博客

A-A+

javascript Window 对象详解介绍

2016年01月27日 前端设计 暂无评论 阅读 8 views 次

javascript Window 对象详解介绍 大家可参考一上。

Window 对象

Window 对象表示浏览器中打开的窗口，如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。

Window 对象集合

frames[] 返回窗口中所有命名的框架，该集合是 Window 对象的数组，每个 Window 对象在窗口中含有一个框架或 ，属性 frames.length 存放数组 frames[] 中含有的元素个数，注意，frames[] 数组中引用的框架可能还包括框架，它们自己也具有 frames[] 数组。

Window 对象属性

closed属性可返回一个布尔值，该值声明了窗口是否已经关闭，该属性为只读，当浏览器窗口关闭时，表示该窗口的 Windows 对象并不会消失，它将继续存在，不过它的 closed 属性将设置为 true

语法：window.closed;

实例：document.write(window.closed); //输出 false

defaultStatus属性可设置或返回窗口状态栏中的默认文本，该属性可读可写，该文本会在页面加载时被显示

语法：window.defaultStatus=sometext;

status属性可设置或返回窗口状态栏中的文本

语法：window.status=sometext;

self返回对窗口自身的只读引用

top属性返回最顶层的先辈窗口，该属性返回对一个顶级窗口的只读引用，如果窗口本身就是一个顶级窗口，top 属性存放对窗口自身的引用，如果窗口是一个框架，那么 top 属性引用包含框架的顶层窗口

Window 对象方法

alert()用于显示带有一条指定消息和一个 OK 按钮的警告框

语法：alert(message); //message 要在 window 上弹出的对话框中显示的纯文本（而非 HTML 文本）

实例：alert('http://justflyhigh.com');

setInterval()按照指定的周期（以毫秒计）来调用函数或计算表达式，setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭，由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数

语法：setInterval(code,millisec);

实例：function clock(){

代码如下:

  1. alert('http://xiariboke.net');  
  2.        }   
  3.        window.setInterval('clock()',1000); //每一秒 弹一次框  

clearInterval()取消由 setInterval() 设置的 timeout，clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值

语法：clearInterval(id_of_setinterval);

实例：var i = 1;

代码如下:

  1. var timer = window.setInterval('clock()',1000);  
  2.     function clock(){  
  3.    if(i == 10){  
  4.        window.clearInterval(timer);  
  5.    }  
  6.    document.getElementById('test').innerHTML = i++;  
  7.     }  

当i为10时，停止

setTimeout()用于在指定的毫秒数后调用函数或计算表达式，setTimeout() 只执行 code 一次，如果要多次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

语法：setTimeout(code,millisec);

实例：var i = 1;

代码如下:

  1. function clock(){  
  2.     document.getElementById('test').innerHTML = i++;  
  3.     setTimeout("clock()",1000);  
  4.      }  

clearTimeout()取消由 setTimeout() 方法设置的 timeout

语法：clearTimeout(id_of_settimeout);

实例：var i = 1;

代码如下:

  1. var timer;  
  2.        function clock(){  
  3.       document.getElementById('test').innerHTML = i++;  
  4.       timer = setTimeout("clock()",1000);  
  5.        }  
  6.        function stop(){  
  7.       clearTimeout(timer);  
  8.        }  

调用stop函数，停止计时

close()用于关闭浏览器窗口，方法 close() 将关闭有 window 指定的顶层浏览器窗口，某个窗口可以通过调用 self.close() 或 只调用 close() 来关闭其自身，只有通过 JavaScript 代码打开的窗口才能够由 JavaScript 代码关闭.

语法:window.close();

confirm()用于显示一个带有指定消息和 OK 及取消按钮的对话框，如果用户点击确定按钮，则 confirm() 返回 true，如果点击取消按钮，则 confirm() 返回 false，在用户点击确定按钮或取消按钮把对话框关闭之前，它将阻止用户对浏览器的所有输入，在调用 confirm() 时，将暂停对 JavaScript 代码的执行，在用户作出响应之前，不会执行下一条语句

语法：confirm(message); //message 要在 window 上弹出的对话框中显示的纯文本（而非 HTML 文本）

moveBy()相对窗口的当前坐标把它移动指定的像素

语法：window.moveBy(x,y); //x 要把窗口右移的像素数，y 要把窗口下移的像素数

moveTo()把窗口的左上角移动到一个指定的坐标

语法：window.moveTo(x,y); //x 窗口新位置的 x 坐标，y 窗口新位置的 y 坐标

open()用于打开一个新的浏览器窗口或查找一个已命名的窗口

语法：window.open(URL,name,features,replace);

URL 一个可选的字符串，声明了要在新窗口中显示的文档的 URL，如果省略了这个参数，或者它的值是空字符串，那么新窗口就不会显示任何文档

name 一个可选的字符串，该字符串是一个由逗号分隔的特征列表，其中包括数字、字母和下划线，该字符声明了新窗口的名称，这个名称可以用作标记 a 和 form 的属性 target 的值，如果该参数指定了一个已经存在的窗口，那么 open() 方法就不再创建一个新窗口，而只是返回对指定窗口的引用，在这种情况下，features 将被忽略

features 一个可选的字符串，声明了新窗口要显示的标准浏览器的特征，如果省略该参数，新窗口将具有所有标准特征

replace 一个可选的布尔值，规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目，支持下面的值：true - URL 替换浏览历史中的当前条目，false - URL 在浏览历史中创建新的条.

窗口特征（Window Features）

channelmode=yes|no|1|0 是否使用剧院模式显示窗口，默认为 no

directories=yes|no|1|0 是否添加目录按钮，默认为 yes

fullscreen=yes|no|1|0 是否使用全屏模式显示浏览器，默认是 no，处于全屏模式的窗口必须同时处于剧院模式

height=pixels 窗口文档显示区的高度，以像素计

left=pixels 窗口的 x 坐标，以像素计

location=yes|no|1|0 是否显示地址字段，默认是 yes

menubar=yes|no|1|0 是否显示菜单栏，默认是 yes

resizable=yes|no|1|0 窗口是否可调节尺寸，默认是 yes

scrollbars=yes|no|1|0 是否显示滚动条，默认是 yes

status=yes|no|1|0 是否添加状态栏，默认是 yes

titlebar=yes|no|1|0 是否显示标题栏，默认是 yes

toolbar=yes|no|1|0 是否显示浏览器的工具栏，默认是 yes

top=pixels 窗口的 y 坐标

width=pixels 窗口的文档显示区的宽度，以像素计

实例：window.open('http://xiariboke.net','偶的主角是你','width=400,height=300');

print()用于打印当前窗口的内容，调用 print() 方法所引发的行为就像用户单击浏览器的打印按钮，通常，这会产生一个对话框，让用户可以取消或定制打印请求

语法：window.print();

prompt()用于显示可提示用户进行输入的对话框，如果用户单击提示框的取消按钮，则返回 null，如果用户单击确认按钮，则返回输入字段当前显示的文本，在用户点击确定按钮或取消按钮把对话框关闭之前，它将阻止用户对浏览器的所有输入，在调用 prompt() 时，将暂停对 JavaScript 代码的执行，在用户作出响应之前，不会执行下一条语句

语法：prompt(text,defaultText); //text 可选，要在对话框中显示的纯文本（而不是 HTML 格式的文本），defaultText 可选，默认的输入文本

resizeBy() 用于根据指定的像素来调整窗口的大小。

语法：resizeBy(width,height);

resizeTo() 用于把窗口大小调整为指定的宽度和高度

语法：resizeTo(width,height);

scrollBy()把内容滚动指定的像素数

语法：scrollBy(xnum,ynum);

scrollTo()把内容滚动到指定的坐标

语法：scrollTo(xpos,ypos);

实例代码如下:

  1. //speed 滚动速度 time 时间间隔  
  2. function gotoTop(speed,time){  
  3.   
  4.     speed = speed || 0.1;  
  5.   
  6.     time = time || 16;  
  7.   
  8.     // 滚动条到页面顶部的水平距离  
  9.     var x = document.body.scrollLeft;  
  10.   
  11.     // 滚动条到页面顶部的垂直距离  
  12.     var y = document.body.scrollTop;  
  13.   
  14.     // 滚动距离 = 目前距离 / 速度, 因为距离原来越小, 速度是大于 1 的数, 所以滚动距离会越来越小  
  15.     speed++;   
  16.     window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));  
  17.   
  18.     // 如果距离不为零, 继续调用迭代本函数  
  19.     if(x > 0 || y > 0) {  
  20.   
  21.         window.setTimeout("gotoTop(" + speed + ", " + time + ")", time);  
  22.     }  
  23. }  
标签：

给我留言