JS面向对象和DOM

1.何为对象？
通俗的说，对象（object）就是某种东西，一只猫一辆自行车都是对象。对于js，它处理了的对象都在Web 浏览器中，比如窗口、表单和表单元素、按钮、复选框等都是对象。
又比如你有多只猫，为了将不同的猫区分开来，可以为每只猫取不同的名字。

JS严格的说是基于对象，并没有 JAVA 中那么严格的要求，JS 中没有类和接口，也可以把JS 中的对象看作类。

2.属性
对象具有属性，猫有毛，自行车有轮子，在 js中，窗口有标题，表单有复选框。

改变对象属性就修改了这个对象，相同的属性名可以用于不同的对象。假如有一个叫 empty 的属性，可以在合适的任何地方使用，可以是猫的肚子空了，也可以是猫食盆空了。

需要注意的是，属性也是对象，比如自行车的轮子本身也是对象，可以具有自己的属性，如轮子的颜色大小。所以，对象也可以有子对象。

3.方法

对象可以做的事称为方法。猫会叫，自行车可以前进，计算机会死机。JS 对象也有方法：按钮的 click() 、窗口的open() 等。

4.面向对象

将对象、属性和方法结合在一起，可以描述一个对象 或过程。

5.DOM简介

在网页上，组成页面（文档）的对象被组织在一个树形结构中。

js将文档中每个项目视为对象，js可以操纵这些对象，文档中对对象的表示称为文档对象模型（DOM）。

• HTML DOM对象

  Document 对象
  每个载入浏览器的 HTML 文档都会成为 Document 对象。

  Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。

  Document 对象集合

  all[] 提供对文档中所有 HTML 元素的访问。
  forms[] 返回对文档中所有 Form 对象引用。
  images[] 返回对文档中所有 Image 对象引用。
  links[] 返回对文档中所有 Area 和 Link 对象引用。
  …

  Document 对象属性

  body 提供对 元素的直接访问。
  cookie 设置或返回与当前文档有关的所有 cookie。
  domain 返回当前文档的域名。
  lastModified 返回文档被最后修改的日期和时间。
  referrer 返回载入当前文档的文档的 URL。
  title 返回当前文档的标题。
  URL 返回当前文档的 URL。

  Document 对象方法

  close() 关闭用 document.open() 方法打开的输出流，并显示选定的数据。
  getElementById() 返回对拥有指定 id 的第一个对象的引用。
  getElementsByName() 返回带有指定名称的对象集合。
  getElementsByTagName() 返回带有指定标签名的对象集合。
  open() 打开一个流，以收集来自任何 document.write() 或 document.writeln() 方法的输出。
  write() 向文档写 HTML 表达式 或 JavaScript 代码。
  writeln() 等同于 write() 方法，不同的是在每个表达式之后写一个换行符。

• HTML DOM Element 对象

  在 HTML DOM 中，Element 对象表示 HTML 元素。

  Element 对象可以拥有类型为元素节点、文本节点、注释节点的子节点

• HTML DOM Attribute 对象

  在 HTML DOM 中，Attr 对象表示 HTML 属性。

  HTML 属性始终属于 HTML 元素。

• HTML DOM Event 对象

  Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

  事件通常与函数结合使用，函数不会在事件发生前被执行！

  树中的每个对象也称为树的节点。可以使用JS 修改树的任何方面，包括添加、访问、修改和删除树上的节点。树上的的每个对象都是一个节点。

  如果节点包含HTML标签，就称为元素节点，否则为文本节点，注释为注释节点。

6.处理事件

事件是用户在访问页面时执行的操作。如鼠标的点击，表单的提交。

JS使用称为事件处理程序的命令来处理事件。用户在页面上的作用会触发脚本的事件处理程序。

常用的事件处理程序可参考W3School 手册。

注意 ：如果希望页面装载时触发脚本，就要使用 onload()
命令。这样js 代码会在页面完成装载后执行。