zoukankan      html  css  js  c++  java
  • 课堂笔记--------JavaScript 的DOM操作

    1、DOM的基本概念

    DOM是文档对象模型,这种模型为树模型;文档是指标签文档;对象是指文档中每个元素;模型是指抽象化的东西。

    2、Window对象操作

    一、属性和方法

    属性(值或者子对象):

    opener:打开当前窗口的源窗口,如果当前窗口是首次启动浏览器打开的,则opener是null。

    dialogArgument:对话框返回值。

    子对象:history,location,document,status,menubar,toolbar等。

    方法(函数):事件(事先设置好的程序,被触发)。

    二、Window.open"第一部分""第二部分""第三部分""第四部分"

    Window.open的特征参数:

    第一部分:写页面地址。

    第二部分:_blank 打开的方式,在新窗口还是自身的窗口。

    第三部分:控制打开的窗口格式,可以写多个,用空格隔开如下:

              toolbar=no新打开的窗口无工具条 ;

              menubar=no无菜单栏 status=no无状态栏 ;

              width=100 height=100 宽度高度;

              left=100 打开的窗口距离左边多少距离;

              resizable=no窗口大小不可调 ;

              scrollbars=yes 出现滚动条;

              location=yes 有地址栏;

    Window.open也有返回值,它的返回值是:新打开的窗口对象。

    例如:

    最简单的打开窗口:window.open("Untitled-6.html");

    打开一个窗口并保存在变量中:var w= window.open();

    可以将打开的多个窗口保存在数组w里:

    function openW()

    {

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

    }

    三、window.close():关闭当前窗口;

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

    关闭多个子窗口:先将打开的窗口存入数组内,利用循环将其挨个关闭;

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

    四、间隔与延迟

    间隔执行一段代码(函数):window.setInterval("要执行的代码",间隔的毫秒数)

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

    延迟一段时间执行某一段代码(函数):window.setTimeout("要执行的代码",延迟的毫秒数)

    清除延迟:window.clearTimeout(延迟的id);清除setTimeout

    五、调整页面

    window.navigate("url") 跳转至目标页面,在谷歌浏览器下有bug;

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

    window.resizeTo(宽,高) 调整页面的宽度和高度;

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

    六、模态对话框和非模态对话框

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

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

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

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

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

     

    3、Window.history对象

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

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

    window.history.go(n); n如果是正数则代表前进n个页面,n如果是负数则代表后退n个页面,一般常用这一种。

     

    4、Window.location对象

    location地址栏

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

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

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

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

     

    5、Window.status对象

    status状态栏,可以给状态栏添加要显示的文字

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

    例如:

    function s()
    {
        window.status = "向前走 就这么走";
    }
     

    复习:

    一、基本语法:数据类型(字符串,小数,整数,布尔,时间) var,
    var s = "3.14"; var n = parseFloat(s); ; s += 5;
    var d = parseInt(s);
    isNaN(字符串):判断是否是数字模样的字符串;是-false; 不是-true

    运算符:四大类
    表达式:
    语句:三大类(顺序,分支,循环)
    分支:if(){}; if...else...;if...else if...else if ......else;if嵌套
    循环:穷举,迭代;四要素(初始条件,循环条件,循环体,状态改变):
    数组;var a = new Array()
    函数:四要素(名称,输入,返回,加工)
    function Show()
    {
    }

    二、DOM操作:树
    window对象——浏览器窗口

    window.location:地址栏
    window.history:访问历史
    window.status:状态栏
    window.document:重点!

     

     

  • 相关阅读:
    BZOJ2821 作诗(Poetize) 【分块】
    BZOJ2724 蒲公英 【分块】
    Codeforces 17E Palisection 【Manacher】
    BZOJ2565 最长双回文串 【Manacher】
    Codeforces 25E Test 【Hash】
    CODEVS3013 单词背诵 【Hash】【MAP】
    HDU2825 Wireless Password 【AC自动机】【状压DP】
    HDU2896 病毒侵袭 【AC自动机】
    HDU3065 病毒侵袭持续中【AC自动机】
    HDU2222 Keywords Search 【AC自动机】
  • 原文地址:https://www.cnblogs.com/yuyu1993/p/5484215.html
Copyright © 2011-2022 走看看