window对象

window属性:

opener:打开当前窗口的源窗口,如果这个窗口是由别的网页点击链接跳转过来的,或者是从另外一个页面点击打开窗口打开的,opener就是找到源页面的。如果当前窗口是首次启动浏览器打开的,则运行alert(window.opener);弹出窗口就会出现null,表示没有源网页。

window方法:

事件是先设置写好的程序代码(用函数封装),代码写好后先封装起来,被触发后执行该程序。

例如:

<input type="button" value="执行事件"  onclick="Show()"/>
function Show()
{
alert("aa");
}

上面这段函数写好以后不会执行,当点击“执行事件”这个按钮后才会执行,输出结果 aa。执行事件是这个按钮的名字,onclick表示指向的调用的函数的名称,Show就是函数的名称。

1.open:打开页面

open里面有四个参数,window.open("第一部分","第二部分","第三部分","第四部分"),第四个一般不会用到,不用写。

第一部分:写要打开的页面地址
    第二部分:打开的方式,_blank 是在新窗口打开 ;_self是在自身窗口打开。
    第三部分:控制打开的窗口属性,可以写多个,用空格隔开,控制的方式有以下几种

    toolbar=no新打开的窗口无工具条
    menubar=no无菜单栏 status=no无状态栏
    width=100 height=100 宽度高度
    left=100 打开的窗口距离左边多少距离
    resizable=no窗口大小不可调
    scrollbars=yes 出现滚动条
    location=yes 有地址栏

    例如: 

function Show()
{
  window.open("http://www.baidu.com","_black","width=100,height=100");
}

  上面代码会在新的窗口中打开一个100*100的百度页面。

window.open可以打开一个新的窗体,打开一个新的窗口之后会返回一个值,这个返回值叫窗体对象。有返回值就可以用一个变量接收,接收值的用处下面会提到。window.open打开窗口时会打开n个,点击一下按钮就会打开一次,如果想要只打开一次,用下面代码实现。

var a;
function Show()
{
if(a==null)
{
    a=window.open("http://www.baidu.com","_black","width=100,height=100");
}
}

表示用a接收打开网站时返回的变量值,如果变量值=null(没有变量),就打开新窗口,如果有变量值,就不再打开新的窗口。

2.close:关闭窗口

如果直接调用window.close();,作用是关闭当前页面,如果想关闭其他页面,例如关闭上面已经打开的页面,用下面代码实现。

   

<input type="button" value="关闭" onclick="Guan()" />
function Guan()
{
if(a!=null)
{
a.close();
}
}

做一个关闭按钮,如果返回的变量不等于null,证明网页在新的窗口打开了,直接用a.close();关闭,关闭返回量为a的窗口。

上面代码只能关闭一个窗口,如果在一个窗口中打开了n个窗口,可以用下面代码关闭所有打开的新的窗口。

    

<input type="button" value="打开窗体" onclick="Opens()" />
<input type="button" value="关闭窗体" onclick="Closes()" />
var attr = Arry();
function Opens()
{
var b = window.open("http://www.baidu.com","_blank");
attr.push(b);
}      
function Closes()
{
for(var i=0;i<attr.length;i++)
{
attr[i].close();
}
}

关闭多个代码的方式是每当打开一个新的窗口时,就会有一个返回值,把这些返回值放到一个数组里面。关闭这个数组,就会把里面的所有元素关闭,同时也把各元素所关联的窗口关闭。

3.间隔和延迟

延迟不是一个循环,只是延迟多长时间去执行。函数命名一般是用名称的字母,首字母大写。变量命名一般是小写。window.setInterval("要执行的代码",间隔的毫秒数)

示例写法:window.setInterval("alert('aa')",1000);当双引号需要套用时,里面的双引号要写成单引号,例如("alert('aa')",如果写成两个“”,系统会认为相邻的两个“”之间是一个字符串,系统就会报错。

或者:window.setInterval("var c = 'hello';alert(c)",1000);  一般不用这种写法,显得太乱。

一般会这样写:

    

<input type="button" value="间隔" onclick="JianGe()" />//放在body
function JianGe()
{
window.setInterval("Jian()",1000)
}
function Jian()
{
alert("你好");
}

setInterval在执行时也会有个返回值,它返回的是一个间隔的id,每个间隔弹出的窗口的id是不一样的,可以通过返回值控制间隔。把这些返回值存到一个变量里面,当想结束间隔时,通过id结束就可以了。

window.clearInterval:(间隔的id); 循环一次之后用来清除隔几秒执行的代码

示例:

    

var id;
function JianGe()
{
id = window.setInterval("Jian('')",1000);
}
function Jian()
{
window.open("http://www.baidu.com","_blank","width=200 height=200");
}
function JieShu()
{
window.clearInterval(id);
}

window.setTimeout  延迟执行("要执行的代码",延迟的毫秒数)

    

<input type="button"  value="延迟执行" onclick="YanChi"/>
function YanChi()
{
window.setTimeout("alert('aa')",2000)
}

延迟执行只弹出来一次,只是延迟,上面代码表示延迟2s执行。

另外,延迟也可以做成间隔的效果,下列代码可以实现该功能。其原理是每隔1s,函数YanJian()就自己调用自己一次,实现间隔的效果。

    

<input type="button" value="延迟做间隔" onclick="YanJian" />
function YanJian()
{
alert("aa");
window.setTimeout("YanJian",1000)
}
//window.clearTimeout(延迟的id);清除setTimeout,一般延迟执行较为常用。

4.window.history.go(n); n是正数代表前进n个页面,n是负数代表后退n个页面。

JS之window对象的更多相关文章

  1. js的window对象

    js的window对象 1.子窗口方法 function testOpen(){ window.open('son.html','newwindow','height=400, width=600, ...

  2. js中window对象详解以及页面跳转

    1.window.top.window.location = "index.asp"; 2.window.top.location.href="index.asp&quo ...

  3. js中Window 对象及其的方法

    window.location 对象 window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面.window.location 对象在编写时可不使用 wind ...

  4. JS day01——window对象、执行顺序、线程模型

    1.window对象 window对象表示当前浏览器的窗口,它是一个顶级对象,我们创建的所有对象.函数.变量都是window对象的成员. window对象自带了一些非常有用的方法.属性. window ...

  5. js中window对象的opener属性的一个坑

    2018-05-08 17:48:33 今天我编写代码碰到了一个让我纠结了很久的坑,特别想在此说一下,让其他人避免我踏过的这个坑. 这个坑就是:在我自己写的子窗口中用opener属性却获取不到父窗口的 ...

  6. 转-JS之Window对象

    一.说明:他是JS中最大的对象,它描述的是一个浏览器窗口,一般要引用他的属性和方法时,不需要用“Window.XXX”这种形式,而是直接使用“XXX”.一个框架页面也是一个窗口. 二.Window窗口 ...

  7. js之window对象(慕课网学习笔记)

    javaScript定义了一个变量一个函数都会变成window中的一个成员 var a=1; alert(window.a) //会输出a的值 window基础 创建窗口.调整窗口.移动窗口.关闭窗口 ...

  8. js修改window对象中的url历史记录

    //页面地址:http://localhost/11/account.html//访问页面后,地址变为:http://localhost/11/account.html?type=banana con ...

  9. Javascript高级编程学习笔记(28)—— BOM(2)window对象2

    今天讲一下window对象和浏览器导航,弹窗等有关的内容 导航和打开窗口 window.open() 用于导航到某个特定 url 该方法接收四个参数 1.url 2.窗口目标(当页面中有多个框架fra ...

随机推荐

  1. button type=“submit”

    写js遇到任何怪异的行为 一定要先看看是不是submit搞的鬼. 函数内部最后总是返回 return false; 也是一个好的习惯

  2. Python 零碎信息-基础 02

    1. range xrange 的差别 1.1 range 返回列表对象. 1.2 xrange 返回xrange对象  不需要返回列表里面的值, 节省内存. >>> range(1 ...

  3. 利用SqlServer的作业定时清除过期数据

    有时候我们的数据库中可能会有那么些存放动态数据的表,比如一些每天定时发出的消息通知信息等数据.这些数据我们只需要临时保存,一些老旧的数据需要定时去清除掉,不然时间一长的话单表数据堆积非常严重.导致数据 ...

  4. HTML页面垂直滚动条不见

    <body style="overflow-y:scroll;"> </body>

  5. xpath教程二 ---- 通过ID和Class检索

    必备知识点 在html中,id是唯一的 在html中,class是可以多处引用的 工具 Python3版本 lxml库[优点是解析快] HTML代码块[从网络中获取或者自己杜撰一个] requests ...

  6. C#中pictureBox笔记

    if (File.Exists(productInfo.预览图路径)) this.picPreview.Image = BitmapFactory.Alloc(productInfo.预览图路径, f ...

  7. Bootstrap 轮播图的使用和理解

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

  8. jQuery实现三级联动

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. BZOJ 1045 糖果传递(思维)

    设第i个人给了第i+1个人mi个糖果(可以为负),因为最后每个人的糖果都会变成sum/n. 可以得到方程组 mi-mi+1=a[i+1]-sum/n.(1<=i<=n). 把方程组化为mn ...

  10. [LOJ2983] [WC2019] 数树

    题目链接 LOJ:https://loj.ac/problem/2983 BZOJ:https://lydsy.com/JudgeOnline/problem.php?id=5475 洛谷:https ...