JavaScript学习笔记详解-----(三)

JavaScript Window–浏览器对象模型

    浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器"对话"。
    BOM：Browser Object Model，中文浏览器对象模型。
    虽然现在BOM尚无正式标准，但是由于现代浏览器已经（几乎）实现了 JavaScript 交互性方面
    的相同 方法和属性，因此window常被认为是 BOM 的方法和属性。

  window对象

        所有浏览器都支持 window 对象
        所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。
        全局变量是 window 对象的属性。全局函数是 window 对象的方法。
        Window 对象表示浏览器中打开的窗口。

  window对象属性

        history对象
            window.history 对象包含浏览器的历史。
            window.history对象在编写时可不使用 window 这个前缀。
            常用方法：
                history.back() - 与在浏览器点击后退按钮相同
                history.forward() - 与在浏览器中点击向前按钮相同
                history.go(1/-1)-- 参数为1：等同于history.forward()，参数为-1，等同于
                history.back()
        location对象
            window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新页面
            常用属性和方法：
                window.location 对象在编写时可不使用 window 这个前缀。
                href 当前窗口正在浏览的网页地址
                replace(url) 转向到url网页地址
                reload() 重新载入当前网址，如同按下刷新按钮

        window对象方法

  弹框案例

  定时器案例

JavaScript之事件

    HTML 事件是发生在 HTML 元素上的事情。当在 HTML 页面中使用 JavaScript 时， JavaScript
    可以触发这些事件。

  HTML事件

        HTML 事件可以是浏览器行为，也可以是用户行为。
        例如页面加载完成、你点击个按钮、文本框输入了文字等等，都是HTML事件的案例。
        通过当事件发生时，我们希望可以做些事情，例如点击完毕按钮之后希望跳转页面
        那么这些要做的事情我们就可以通过JavaScript实现。
        常用的HTML事件

        语法
            script中：function 方法名（）{
            }
            标签中 ： 事件名 = “ 方法名（）”

JavaScript之DOM模型

    通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。
    DOM:Document Object Model,文档对象模型。
    当网页被加载时，浏览器会创建页面的文档对象模型。
    HTML DOM 模型被构造为对象的树：

        通过可编程的对象模型，JavaScript 获得了足够的能力来创建动态的 HTML。
            JavaScript 能够改变页面中的所有 HTML 元素
            JavaScript 能够改变页面中的所有 HTML 属性
            JavaScript 能够改变页面中的所有 CSS 样式
            JavaScript 能够对页面中的所有事件做出反应

  document对象

        当浏览器载入 HTML 文档, 它就会成为 Document 对象。
            Document 对象是 HTML 文档的根节点。
            Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
            Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。
            document对象常用方法
                查找 HTML 元素常用方法

  修改 HTML 内容和属性

        修改内容
            修改 HTML 内容的最简单的方法是使用 innerHTML 属性。
            修改 HTML 元素的内容的语法：
            document.getElementById(id).innerHTML=新的 HTML。
            绝对不要在文档(DOM)加载完成之后使用 document.write()。这会覆盖该文档。
        修改 HTML 属性
            修改 HTML 元素属性的语法：
                方式1：document.getElementById(id).attribute=新属性值
                方式2：document.getElementById(id).setAttribute(属性名，属性值);
        修改 HTML 元素的css
            修改 HTML 元素css的语法：
                document.getElementById(id).style.property=新样式
                document.getElementById(“myli”).style.color="blu

  HTML DOM 元素 (节点)

        创建新的 HTML 元素

            createElement(“p”);//创建一个新的段落元素
            createTextNode(“这是我新创建的段落”);//新创建的文本节点
            newElementP.appendChild(text);将文本的节点添加到新创建的元素中

        替换 HTML 元素 -replaceChild()

        删除元素 -removeChild()