Dom笔记1：什么是Dom编程

来源：互联网发布：软件license未授权编辑：程序博客网时间：2024/06/07 08:31

1：JavaScript和Dom的关系：

JavaScript和Dom的关系就像C#和.net 的关系一样，Dom是为JavaScript提供一些类。同过JavaScript调用Dom操作网页界面上的东西，从而进行HTML开发，实现网页动态效果。
DOM 就是 HTML 页面的对象模型，将每个标签都做为一个对象，JavaScript 通过调用 DOM 中的属性、方法就可以对网页中的文本框、层等元素进行编程控制。比如通过操作文本框的 DOM 对象，就可以读取文本框中的值、设置文本框中的值。

JavaScript 和 Dom的关系就像 C# 和 .Net Framwork 的关系一样。没有 .net ， C# 只能for 、 while ，连使用 WriteLine， MessageBox 都不行。 Dom 就是一些让 JavaScript 能操作 HTML 页面控件的类、函数。
DOM 也像 WinForm 一样，通过事件、属性、方法进行编程。

2：什么是DHTML：
就是CSS+JavaScript+DOM=DHTML，简单地说就是JavaScript操作Dom。

3：Dom中的事件：

静态绑定事件：

<body onmousedown="alert(' 哈哈 ')"> 当点击鼠标的时候执行
onmousedown 中的代码。有时间事件响应的代码太多，就放到单独的函数
中：

<script type="text/javascript">        function bodymousedown() {            alert(" 网页被点坏了，赔吧！ ");            alert(" 逗你玩的！ ");        }    </script>

bodymousedown 后的括号不能丢（ onmousedown="bodymousedown" 这样调用不行），因为表示 onmousedown 事件发生时调用 bodymousedown 函数，而不是 onmousedown 事件的响应函数是 bodymousedown 。

动态绑定事件：

动态设置事件
可以在代码中动态设置事件响应函数，就像 .Net 中 btn.Click+= 一样
   function f1() {
   alert("1");
   }
   function f2(){
   alert("2");
   }
<input type="button" onclick="document.ondblclick=f1" value=" 关联事件 1" />// 注意 f1 不要加括号。
如果加上括号就变成了执行 f1函数，并且将函数的返回值复制给document.ondblclick
<input type="button" onclick="document.ondblclick=f2" value=" 关联事件 2" />