2017-3-28 javaScript DOM 操作

Posted 2020-09-07 Zoe

一、DOM的基本概念：DOM是文档对象模型，这种模型为树模型；文档是指标签文档；对象是指文档中每个元素；模型是指抽象化得东西。

二、Windows  对象操作：1、属性和方法：属性（值或者子对象）：opener：打开当前窗口的源窗口，如果当前窗口是首次启动浏览器打开的，则opener是                                                            null。

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　dialogArgument：对话框返回值。

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　子对象：history，location，document，status，menubar，toolbar等。

　　　　　　　　　　　　　　方法（函数）：事件（事先设置好的程序，被触发）。

　　　　　　　　　　　　2、Window.open("第一部分","第二部分","第三部分","第四部分")

　　　　　　　　　　　　　　第一部分：写页面地址。

　　　　　　　　　　　　　　第二部分：_blank 打开方式，或者_self  ，在新窗口还是自身打开

　　　　　　　　　　　　　　第三部分：控制打开的窗口格式，可以写多个，用空格隔开；

　　　　　　　　　　　　　　　　　　　toolbar=no  新打开的窗口无工具条；menubar=no  无菜单栏；status=no  无状态栏；

                                                      width=100  height=100  宽度高度；left=100  打开的窗口距离左边多少距离；

                                                       resizable=no  窗口大小不可调；  scrollbars=yes   出现滚动条；  location=yes   有地址栏；

                                                 注：Window.open   也有返回值，它的返回值是新打开的窗口对象。

　　　　　　　　　　　　　　　　　　　　例如：var  a=window.open();     打开一个窗口并保存在变量中。

　　　　　　　　　　　　打开多个窗口并保存在数组w中：　function  openw（）

                                                                                            {

                                                                                         w[i++]=window.open();

                                                                                                   }

　　　　　　　　　　　　3、window.close():关闭当前窗口；

　　　　　　　　　　　　　　w.close():关闭保存在变量w中的那个窗口；

　　　　　　　　　　　　　　关闭多个子窗口：先将打开的窗口存入数组中，利用循环将其挨个关闭；

　　　　　　　　　　　　　　关闭打开当前窗口的源窗口：window.opener.close();

　　　　　　　　　　　4、调整页面：window.navigate("url")  跳转至目标页面，在谷歌浏览器下有bug；

　　　　　　　　　　　　　　　　　window.moveTo(x,y)   移至页面至某一位置，位置由x和y 决定；

　　　　　　　　　　　　　　　　　window.resizeTo（宽，高）   调整页面的宽度和高度；

　　　　　　　　　　　　　　　　window.scrollTo(x,y)  滚动页面至哪里，y代表纵向滚动。

　　　　　　　　　　　5、模态对话框和非模态对话框：

　　　　　　　　　　　　　模态对话框（Modal  Dialogue Box）,是指在用户想要对对话框以外的应用程序进行操作时，必须首先对该对话框进行响应。如单击【确定】                                        或【取消】按钮等将该对话框关闭，它和非模态对话框都是永远置顶的，它们的区别在于对话框打开时，是否允许用户进行其他对象的操作。

　　　　　　　　　　　　　打开模态对话框：window.showModalDialog("url","向目标对话框传的值","窗口特征参数");

　　　　　　　　　　　　　特征参数：用分号隔开，像素大小用px。dialogHeight，dialogWidth，center等

　　　　　　　　　　　　打开非模态对话框：window.showModelessDialog("url","向目标对话框传的值","窗口特征参数")

　　　　　　　　　　　　var  a=window.dialogArgument;可以用一个参数来获取模态或者非模态对话框传递的值。

三、Window.history  对象：

　　　　　　　　　　　　window.history.back();  页面进行后退；

　　　　　　　　　　　　window.history.forward();  页面前进；

　　　　　　　　　　　　window.history.go(n);   n如果是正数则代表前进n个页面，n如果是负数则代表后退n个页面。

四、Window.location   对象：    （location   地址栏）

　　　　　　　　　　　　var   a=window.location.href;    获取当前页面的地址；

　　　　　　　　　　　　window.location.href="http://www.baidu.com";    修改页面地址，会跳转页面

　　　　　　　　　　　　window.location.hostname:    主机名，域名，网站名，可用变量接收；

　　　　　　　　　　　　window.location.pathname:   路径名，可用变量接收。

五、Window.status  对象：       （status    状态栏）

　　　　　　　　　　　　window.status="要在状态栏显示的内容";

　　　　　　　　　　　　　　例如：function  s()

                                                  {

                                                     window.status="向前走  就这么走";

                                                   }