DOM 模型和 Prototype

 
今天介绍一下 DOM 模型和 Prototype框架的一些对象和类，
什么是 DOM模型 --Document Object Module 就是文档对象类型，可以看成是结构化的树形的数据
，闲言少叙书归正传，下面是我最近学习js搜集到的一些document的方法，很实用的。下面将介绍它包含的对象方法。
下面有下载文件：能读懂的就看看下面的prototype.js

Element对象的方法：

visible: function(element)：判断element是否可见, 参数element可以是元素本身或元素id(下面的方面的参数基本上都是这样的)

toggle: function(element)：反转element的可见性

hide: function(element)：隐藏元素

show: function(element)：显示元素

remove: function(element)：移除元素

update: function(element, html) ：使用html更新element的内容，html中的script会执行(下同)

replace: function(element, html)：将element替换为html

inspect: function(element)：element的字符串表示

Element对象的方法：

visible: function(element)：判断element是否可见, 参数element可以是元素本身或元素id(下面的方面的参数基本上都是这样的)

toggle: function(element)：反转element的可见性

hide: function(element)：隐藏元素

show: function(element)：显示元素

remove: function(element)：移除元素

update: function(element, html) ：使用html更新element的内容，html中的script会执行(下同)

replace: function(element, html)：将element替换为html

inspect: function(element)：element的字符串表示

up(element, expression, index)：利用Selector.findElement方法找到element元素的祖先节点中符合表达式expression的所有元素组成的数组索引为index的元素，也可以忽略expression(默认为*，表示匹配所有元素)和index(默认为0)，直接这样调用up(element, index)或up(element)

down(element, expression, index)：跟up一样，只是返回的是子孙节点

previous(element, expression, index)：返回前面的兄弟节点

next(element, expression, index)：返回后面的兄弟节点

getElementsBySelector(element,args)：Selector.findChildElements(element, args)的封装，args表示可以传递多个参数，每个参数是一个css selector表达式，返回element的子孙节点中符合任何一个css selector表达式的元素组成的数组

getElementsByClassName(element, className)：返回element中的子孙节点中符合clsssName的元素

hasClassName: function(element, className) ：判断element是否含有className

addClassName: function(element, className) ：给element添加一个class

removeClassName: function(element, className) ：移除元素中的一个class

observe()：调用Event对象(Prototype中的，将在后面介绍)的observe方法为元素注册事件handle

stopObserving() ：移除注册的事件handle

cleanWhitespace: function(element)：移除元素中空白的文本子节点

empty: function(element)：判断元素是否为空

childOf: function(element, ancestor) ：判断element是否为ancestor的子孙节点

scrollTo: function(element) ：滚动条移动到元素所在的地方

getStyle: function(element, style) ：得到元素某个css样式的值，例如$(element).getStyle("float")

setStyle: function(element, style) ：设置元素的css样式，style十一个对象，例如element.setStyle({left: "40px", "background-color":"#666"})

getDimensions: function(element) ：得到元素的尺寸，即使元素是隐藏的也可以正确的返回，返回 return {width: originalWidth, height: originalHeight}这样的关联数组

makePositioned: function(element) ：当元素的position css属性为static或不存在使，将次属性更改为relative

undoPositioned: function(element) ：跟makePositioned相反的操作

makeClipping: function(element) ：把元素变成clipping(切片)，也就是设置元素的overflow属性为hidden

undoClipping: function(element)：反转上面的方法对元素所做的修改

hasAttribute(element)：判断元素是否有某个属性

Insertion.Before：将内容插入到元素的前面，内容在元素外面

Insertion.Top：将内容插入到元素的顶部，内容在元素里面

Insertion.Bottom：将内容插入到元素的底部，内容在元素里面

Insertion.After：将内容插入到元素后面，内容在元素外面

以上的这些方法经常会使用到的，不过里面有很多方法我也没有使用过，有些是在网上搜集的，有的是在书上找到的，里面有很多在最近制作google日历时用到了，在js创建表格，div什么虽然具有挑战，比起其他使用起来麻烦多了，但是很有逻辑性的。
  希望上面能给JavaScript的学习使用的同仁带来方便，这里可是实现Ajax的关键因素。

提供给大家参考学习，这是经常用到的。