prototype.js常用函数详解(轉)

rototype.js常用函数详解(轉)

http://sunxboy.iteye.com/blog/191496

关键字: prototype

prototype.js常用函数:

函数名	解释	举例
Element.toggle	交替隐藏或显示	Element.toggle(''div1'',''div2'')
Element.hide	隐藏	Element.hide(''div1'',''div2'')
Element.show	显示	Element.show(''div1'',''div2'')
Element.remove	删除	Element.remove(''div1'',''div2'')
Element.getHeight	取得高度	Element.getHeight(''div1'')
Toggle.display	和Element.toggle相同	Toggle.display(''div1'',''div2'')
Insertion.Before	在DIV前插入文字	Insertion.Before(''div1'',''my content'')
Insertion.After	在DIV后插入文字	Insertion.After(''div1'',''my content'')
Insertion.Top	在DIV里最前插入文字	Insertion.Top(''div1'',''this is a text'')
Insertion.Bottom	在DIV里最后插入文字	Insertion.Bottom(''div1'',''this is a text'')
PeriodicalExecuter	以给定频率调用一段JavaScript	PeridicalExecutor(test, 1)"这里test是Javascript的函数,1是频率(1秒).
$	取得一个DIV, 相当于getElementById()	$(''div1'')
Field.clear	清空一个输入框	Field.clear(''textfield1'')
Field.focus	把 焦点集中在输入框上	Field.focus(''select1'')
Field.present	判断内容是否为空	alert(Field.present(''textfield1''))"
Field.select	选择输入框的内容	Field.select(''textfield1'')"
Field.activate	把 焦点集中在输入框上并选择输入框的内容	Field.activate(''textfield1'')"
Form.serialize	把表格内容转化成string
Form.getElements	取得表格内容为数组形式
Form.disable	disable表格所有内容	Form.disable(''form1'') (这个好象不work)
Form.focusFirstElement	把焦点集中在表格第一个元素上	Form.focusFirstElement(''form1'')
Form.reset	Reset表格	Form.reset(''form1'')
Form.Element.getValue	取得表格输入框的值	Form.Element.getValue(''text1'')
Form.Element.serialize	把表格中输入框内容转化成string	Form.Element.serialize(''text1'')
$F	等同于Form.Element.getValue()	$F(''text1'')
Effect.Highlight	高亮特效.	Effect.Highlight(''text1'')
Effect.Fade	褪色特效
Effect.Scale	放大缩小(百分比）	Effect.Scale(''text1'', 200) 这里200 = 200%, 即两倍
Effect.Squish	消失特效．文字缩小后消失	Effect.Squish(''text1'')
Effect.Puff	消失特效．文字放大后消失	Effect.Puff(''text1'')
Effect.Appear	出现特效
Effect.ContentZoom	ZOOM特效．
Ajax.Request	传送Ajax请求给服务器	Ajax.Request(''http://server/s.php'')
Ajax.Updater	传送Ajax请求给服务器并用答复的结果更新指定的Container	Ajax.Updater(''text1'',''http://server/s.php'')

      基本用法:prototype.js给每个主要的类都分了一个Class,使用起来很方便.要产生特定的效果,只要用new Class.function(<argument>)就可以了.例如:

<pre><DIV id="div1"><a href="#" onclick="new Element.toggle('div2')">Click Me</a></DIV>
<DIV id="div2">Hello!</DIV><!-- -->pr e>

      当点击Click Me的时候,div2就会交替隐藏或显示.注意,你可以给toggle加上无限个parameter,比如Element.toggle(''div2'',''div3'',''div4'',...)

<script type="text/javascript">&lt;!-- google_ad_client = &quot;pub-6865176685514262&quot;; google_ad_slot = &quot;6268214656&quot;; google_ad_width = 728; google_ad_height = 90; //--&gt;</script><script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"> </script><script src="http://pagead2.googlesyndication.com/pagead/expansion_embed.js"></script><script src="http://googleads.g.doubleclick.net/pagead/test_domain.js"></script><script>google_protectAndRun(&quot;ads_core.google_render_ad&quot;, google_handleError, google_render_ad);</script>

评论

1 楼 sunxboy 2008-08-06   引用

Js代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="http://sunxboy.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%E4%BB%8A%E5%A4%A9%E4%BB%8B%E7%BB%8D%E4%B8%80%E4%B8%8B%20DOM%20%E6%A8%A1%E5%9E%8B%E5%92%8C%20Prototype%E6%A1%86%E6%9E%B6%E7%9A%84%E4%B8%80%E4%BA%9B%E5%AF%B9%E8%B1%A1%E5%92%8C%E7%B1%BB%EF%BC%8C%0A%E4%BB%80%E4%B9%88%E6%98%AF%20DOM%E6%A8%A1%E5%9E%8B%20--Document%20Object%20Module%20%E5%B0%B1%E6%98%AF%E6%96%87%E6%A1%A3%E5%AF%B9%E8%B1%A1%E7%B1%BB%E5%9E%8B%EF%BC%8C%E5%8F%AF%E4%BB%A5%E7%9C%8B%E6%88%90%E6%98%AF%E7%BB%93%E6%9E%84%E5%8C%96%E7%9A%84%E6%A0%91%E5%BD%A2%E7%9A%84%E6%95%B0%E6%8D%AE%0A%EF%BC%8C%E9%97%B2%E8%A8%80%E5%B0%91%E5%8F%99%E4%B9%A6%E5%BD%92%E6%AD%A3%E4%BC%A0%EF%BC%8C%E4%B8%8B%E9%9D%A2%E6%98%AF%E6%88%91%E6%9C%80%E8%BF%91%E5%AD%A6%E4%B9%A0js%E6%90%9C%E9%9B%86%E5%88%B0%E7%9A%84%E4%B8%80%E4%BA%9Bdocument%E7%9A%84%E6%96%B9%E6%B3%95%EF%BC%8C%E5%BE%88%E5%AE%9E%E7%94%A8%E7%9A%84%E3%80%82%E4%B8%8B%E9%9D%A2%E5%B0%86%E4%BB%8B%E7%BB%8D%E5%AE%83%E5%8C%85%E5%90%AB%E7%9A%84%E5%AF%B9%E8%B1%A1%E6%96%B9%E6%B3%95%E3%80%82%0A%E4%B8%8B%E9%9D%A2%E6%9C%89%E4%B8%8B%E8%BD%BD%E6%96%87%E4%BB%B6%EF%BC%9A%E8%83%BD%E8%AF%BB%E6%87%82%E7%9A%84%E5%B0%B1%E7%9C%8B%E7%9C%8B%E4%B8%8B%E9%9D%A2%E7%9A%84prototype.js%0A%0AElement%E5%AF%B9%E8%B1%A1%E7%9A%84%E6%96%B9%E6%B3%95%EF%BC%9A%0A%0Avisible%3A%20function(element)%EF%BC%9A%E5%88%A4%E6%96%ADelement%E6%98%AF%E5%90%A6%E5%8F%AF%E8%A7%81%2C%20%E5%8F%82%E6%95%B0element%E5%8F%AF%E4%BB%A5%E6%98%AF%E5%85%83%E7%B4%A0%E6%9C%AC%E8%BA%AB%E6%88%96%E5%85%83%E7%B4%A0id(%E4%B8%8B%E9%9D%A2%E7%9A%84%E6%96%B9%E9%9D%A2%E7%9A%84%E5%8F%82%E6%95%B0%E5%9F%BA%E6%9C%AC%E4%B8%8A%E9%83%BD%E6%98%AF%E8%BF%99%E6%A0%B7%E7%9A%84)%0A%0Atoggle%3A%20function(element)%EF%BC%9A%E5%8F%8D%E8%BD%ACelement%E7%9A%84%E5%8F%AF%E8%A7%81%E6%80%A7%0A%0Ahide%3A%20function(element)%EF%BC%9A%E9%9A%90%E8%97%8F%E5%85%83%E7%B4%A0%0A%0Ashow%3A%20function(element)%EF%BC%9A%E6%98%BE%E7%A4%BA%E5%85%83%E7%B4%A0%0A%0Aremove%3A%20function(element)%EF%BC%9A%E7%A7%BB%E9%99%A4%E5%85%83%E7%B4%A0%0A%0Aupdate%3A%20function(element%2C%20html)%20%EF%BC%9A%E4%BD%BF%E7%94%A8html%E6%9B%B4%E6%96%B0element%E7%9A%84%E5%86%85%E5%AE%B9%EF%BC%8Chtml%E4%B8%AD%E7%9A%84script%E4%BC%9A%E6%89%A7%E8%A1%8C(%E4%B8%8B%E5%90%8C)%0A%0Areplace%3A%20function(element%2C%20html)%EF%BC%9A%E5%B0%86element%E6%9B%BF%E6%8D%A2%E4%B8%BAhtml%0A%0Ainspect%3A%20function(element)%EF%BC%9Aelement%E7%9A%84%E5%AD%97%E7%AC%A6%E4%B8%B2%E8%A1%A8%E7%A4%BA%0A%0AElement%E5%AF%B9%E8%B1%A1%E7%9A%84%E6%96%B9%E6%B3%95%EF%BC%9A%0A%0Avisible%3A%20function(element)%EF%BC%9A%E5%88%A4%E6%96%ADelement%E6%98%AF%E5%90%A6%E5%8F%AF%E8%A7%81%2C%20%E5%8F%82%E6%95%B0element%E5%8F%AF%E4%BB%A5%E6%98%AF%E5%85%83%E7%B4%A0%E6%9C%AC%E8%BA%AB%E6%88%96%E5%85%83%E7%B4%A0id(%E4%B8%8B%E9%9D%A2%E7%9A%84%E6%96%B9%E9%9D%A2%E7%9A%84%E5%8F%82%E6%95%B0%E5%9F%BA%E6%9C%AC%E4%B8%8A%E9%83%BD%E6%98%AF%E8%BF%99%E6%A0%B7%E7%9A%84)%0A%0Atoggle%3A%20function(element)%EF%BC%9A%E5%8F%8D%E8%BD%ACelement%E7%9A%84%E5%8F%AF%E8%A7%81%E6%80%A7%0A%0Ahide%3A%20function(element)%EF%BC%9A%E9%9A%90%E8%97%8F%E5%85%83%E7%B4%A0%0A%0Ashow%3A%20function(element)%EF%BC%9A%E6%98%BE%E7%A4%BA%E5%85%83%E7%B4%A0%0A%0Aremove%3A%20function(element)%EF%BC%9A%E7%A7%BB%E9%99%A4%E5%85%83%E7%B4%A0%0A%0Aupdate%3A%20function(element%2C%20html)%20%EF%BC%9A%E4%BD%BF%E7%94%A8html%E6%9B%B4%E6%96%B0element%E7%9A%84%E5%86%85%E5%AE%B9%EF%BC%8Chtml%E4%B8%AD%E7%9A%84script%E4%BC%9A%E6%89%A7%E8%A1%8C(%E4%B8%8B%E5%90%8C)%0A%0Areplace%3A%20function(element%2C%20html)%EF%BC%9A%E5%B0%86element%E6%9B%BF%E6%8D%A2%E4%B8%BAhtml%0A%0Ainspect%3A%20function(element)%EF%BC%9Aelement%E7%9A%84%E5%AD%97%E7%AC%A6%E4%B8%B2%E8%A1%A8%E7%A4%BA%0A%0Aup(element%2C%20expression%2C%20index)%EF%BC%9A%E5%88%A9%E7%94%A8Selector.findElement%E6%96%B9%E6%B3%95%E6%89%BE%E5%88%B0element%E5%85%83%E7%B4%A0%E7%9A%84%E7%A5%96%E5%85%88%E8%8A%82%E7%82%B9%E4%B8%AD%E7%AC%A6%E5%90%88%E8%A1%A8%E8%BE%BE%E5%BC%8Fexpression%E7%9A%84%E6%89%80%E6%9C%89%E5%85%83%E7%B4%A0%E7%BB%84%E6%88%90%E7%9A%84%E6%95%B0%E7%BB%84%E7%B4%A2%E5%BC%95%E4%B8%BAindex%E7%9A%84%E5%85%83%E7%B4%A0%EF%BC%8C%E4%B9%9F%E5%8F%AF%E4%BB%A5%E5%BF%BD%E7%95%A5expression(%E9%BB%98%E8%AE%A4%E4%B8%BA*%EF%BC%8C%E8%A1%A8%E7%A4%BA%E5%8C%B9%E9%85%8D%E6%89%80%E6%9C%89%E5%85%83%E7%B4%A0)%E5%92%8Cindex(%E9%BB%98%E8%AE%A4%E4%B8%BA0)%EF%BC%8C%E7%9B%B4%E6%8E%A5%E8%BF%99%E6%A0%B7%E8%B0%83%E7%94%A8%20up(element%2C%20index)%E6%88%96up(element)%0A%0Adown(element%2C%20expression%2C%20index)%EF%BC%9A%E8%B7%9Fup%E4%B8%80%E6%A0%B7%EF%BC%8C%E5%8F%AA%E6%98%AF%E8%BF%94%E5%9B%9E%E7%9A%84%E6%98%AF%E5%AD%90%E5%AD%99%E8%8A%82%E7%82%B9%0A%0Aprevious(element%2C%20expression%2C%20index)%EF%BC%9A%E8%BF%94%E5%9B%9E%E5%89%8D%E9%9D%A2%E7%9A%84%E5%85%84%E5%BC%9F%E8%8A%82%E7%82%B9%0A%0Anext(element%2C%20expression%2C%20index)%EF%BC%9A%E8%BF%94%E5%9B%9E%E5%90%8E%E9%9D%A2%E7%9A%84%E5%85%84%E5%BC%9F%E8%8A%82%E7%82%B9%0A%0AgetElementsBySelector(element%2Cargs)%EF%BC%9ASelector.findChildElements(element%2C%20args)%E7%9A%84%E5%B0%81%E8%A3%85%EF%BC%8Cargs%E8%A1%A8%E7%A4%BA%E5%8F%AF%E4%BB%A5%E4%BC%A0%E9%80%92%E5%A4%9A%E4%B8%AA%E5%8F%82%E6%95%B0%EF%BC%8C%E6%AF%8F%E4%B8%AA%E5%8F%82%E6%95%B0%E6%98%AF%E4%B8%80%E4%B8%AAcss%20selector%E8%A1%A8%E8%BE%BE%E5%BC%8F%EF%BC%8C%E8%BF%94%E5%9B%9Eelement%E7%9A%84%E5%AD%90%E5%AD%99%E8%8A%82%E7%82%B9%E4%B8%AD%E7%AC%A6%E5%90%88%E4%BB%BB%E4%BD%95%E4%B8%80%E4%B8%AAcss%20selector%E8%A1%A8%E8%BE%BE%E5%BC%8F%E7%9A%84%E5%85%83%E7%B4%A0%E7%BB%84%E6%88%90%E7%9A%84%E6%95%B0%E7%BB%84%0A%0AgetElementsByClassName(element%2C%20className)%EF%BC%9A%E8%BF%94%E5%9B%9Eelement%E4%B8%AD%E7%9A%84%E5%AD%90%E5%AD%99%E8%8A%82%E7%82%B9%E4%B8%AD%E7%AC%A6%E5%90%88clsssName%E7%9A%84%E5%85%83%E7%B4%A0%0A%0AhasClassName%3A%20function(element%2C%20className)%20%EF%BC%9A%E5%88%A4%E6%96%ADelement%E6%98%AF%E5%90%A6%E5%90%AB%E6%9C%89className%0A%0AaddClassName%3A%20function(element%2C%20className)%20%EF%BC%9A%E7%BB%99element%E6%B7%BB%E5%8A%A0%E4%B8%80%E4%B8%AAclass%0A%0AremoveClassName%3A%20function(element%2C%20className)%20%EF%BC%9A%E7%A7%BB%E9%99%A4%E5%85%83%E7%B4%A0%E4%B8%AD%E7%9A%84%E4%B8%80%E4%B8%AAclass%0A%0Aobserve()%EF%BC%9A%E8%B0%83%E7%94%A8Event%E5%AF%B9%E8%B1%A1(Prototype%E4%B8%AD%E7%9A%84%EF%BC%8C%E5%B0%86%E5%9C%A8%E5%90%8E%E9%9D%A2%E4%BB%8B%E7%BB%8D)%E7%9A%84observe%E6%96%B9%E6%B3%95%E4%B8%BA%E5%85%83%E7%B4%A0%E6%B3%A8%E5%86%8C%E4%BA%8B%E4%BB%B6handle%0A%0AstopObserving()%20%EF%BC%9A%E7%A7%BB%E9%99%A4%E6%B3%A8%E5%86%8C%E7%9A%84%E4%BA%8B%E4%BB%B6handle%0A%0AcleanWhitespace%3A%20function(element)%EF%BC%9A%E7%A7%BB%E9%99%A4%E5%85%83%E7%B4%A0%E4%B8%AD%E7%A9%BA%E7%99%BD%E7%9A%84%E6%96%87%E6%9C%AC%E5%AD%90%E8%8A%82%E7%82%B9%0A%0Aempty%3A%20function(element)%EF%BC%9A%E5%88%A4%E6%96%AD%E5%85%83%E7%B4%A0%E6%98%AF%E5%90%A6%E4%B8%BA%E7%A9%BA%0A%0AchildOf%3A%20function(element%2C%20ancestor)%20%EF%BC%9A%E5%88%A4%E6%96%ADelement%E6%98%AF%E5%90%A6%E4%B8%BAancestor%E7%9A%84%E5%AD%90%E5%AD%99%E8%8A%82%E7%82%B9%0A%0AscrollTo%3A%20function(element)%20%EF%BC%9A%E6%BB%9A%E5%8A%A8%E6%9D%A1%E7%A7%BB%E5%8A%A8%E5%88%B0%E5%85%83%E7%B4%A0%E6%89%80%E5%9C%A8%E7%9A%84%E5%9C%B0%E6%96%B9%0A%0AgetStyle%3A%20function(element%2C%20style)%20%EF%BC%9A%E5%BE%97%E5%88%B0%E5%85%83%E7%B4%A0%E6%9F%90%E4%B8%AAcss%E6%A0%B7%E5%BC%8F%E7%9A%84%E5%80%BC%EF%BC%8C%E4%BE%8B%E5%A6%82%24(element).getStyle(%22float%22)%0A%0AsetStyle%3A%20function(element%2C%20style)%20%EF%BC%9A%E8%AE%BE%E7%BD%AE%E5%85%83%E7%B4%A0%E7%9A%84css%E6%A0%B7%E5%BC%8F%EF%BC%8Cstyle%E5%8D%81%E4%B8%80%E4%B8%AA%E5%AF%B9%E8%B1%A1%EF%BC%8C%E4%BE%8B%E5%A6%82element.setStyle(%7Bleft%3A%20%2240px%22%2C%20%22background-color%22%3A%22%23666%22%7D)%0A%0AgetDimensions%3A%20function(element)%20%EF%BC%9A%E5%BE%97%E5%88%B0%E5%85%83%E7%B4%A0%E7%9A%84%E5%B0%BA%E5%AF%B8%EF%BC%8C%E5%8D%B3%E4%BD%BF%E5%85%83%E7%B4%A0%E6%98%AF%E9%9A%90%E8%97%8F%E7%9A%84%E4%B9%9F%E5%8F%AF%E4%BB%A5%E6%AD%A3%E7%A1%AE%E7%9A%84%E8%BF%94%E5%9B%9E%EF%BC%8C%E8%BF%94%E5%9B%9E%20return%20%7Bwidth%3A%20originalWidth%2C%20height%3A%20originalHeight%7D%E8%BF%99%E6%A0%B7%E7%9A%84%E5%85%B3%E8%81%94%E6%95%B0%E7%BB%84%0A%0AmakePositioned%3A%20function(element)%20%EF%BC%9A%E5%BD%93%E5%85%83%E7%B4%A0%E7%9A%84position%20css%E5%B1%9E%E6%80%A7%E4%B8%BAstatic%E6%88%96%E4%B8%8D%E5%AD%98%E5%9C%A8%E4%BD%BF%EF%BC%8C%E5%B0%86%E6%AC%A1%E5%B1%9E%E6%80%A7%E6%9B%B4%E6%94%B9%E4%B8%BArelative%0A%0AundoPositioned%3A%20function(element)%20%EF%BC%9A%E8%B7%9FmakePositioned%E7%9B%B8%E5%8F%8D%E7%9A%84%E6%93%8D%E4%BD%9C%0A%0AmakeClipping%3A%20function(element)%20%EF%BC%9A%E6%8A%8A%E5%85%83%E7%B4%A0%E5%8F%98%E6%88%90clipping(%E5%88%87%E7%89%87)%EF%BC%8C%E4%B9%9F%E5%B0%B1%E6%98%AF%E8%AE%BE%E7%BD%AE%E5%85%83%E7%B4%A0%E7%9A%84overflow%E5%B1%9E%E6%80%A7%E4%B8%BAhidden%0A%0AundoClipping%3A%20function(element)%EF%BC%9A%E5%8F%8D%E8%BD%AC%E4%B8%8A%E9%9D%A2%E7%9A%84%E6%96%B9%E6%B3%95%E5%AF%B9%E5%85%83%E7%B4%A0%E6%89%80%E5%81%9A%E7%9A%84%E4%BF%AE%E6%94%B9%0A%0AhasAttribute(element)%EF%BC%9A%E5%88%A4%E6%96%AD%E5%85%83%E7%B4%A0%E6%98%AF%E5%90%A6%E6%9C%89%E6%9F%90%E4%B8%AA%E5%B1%9E%E6%80%A7%0A%0AInsertion.Before%EF%BC%9A%E5%B0%86%E5%86%85%E5%AE%B9%E6%8F%92%E5%85%A5%E5%88%B0%E5%85%83%E7%B4%A0%E7%9A%84%E5%89%8D%E9%9D%A2%EF%BC%8C%E5%86%85%E5%AE%B9%E5%9C%A8%E5%85%83%E7%B4%A0%E5%A4%96%E9%9D%A2%0A%0AInsertion.Top%EF%BC%9A%E5%B0%86%E5%86%85%E5%AE%B9%E6%8F%92%E5%85%A5%E5%88%B0%E5%85%83%E7%B4%A0%E7%9A%84%E9%A1%B6%E9%83%A8%EF%BC%8C%E5%86%85%E5%AE%B9%E5%9C%A8%E5%85%83%E7%B4%A0%E9%87%8C%E9%9D%A2%0A%0AInsertion.Bottom%EF%BC%9A%E5%B0%86%E5%86%85%E5%AE%B9%E6%8F%92%E5%85%A5%E5%88%B0%E5%85%83%E7%B4%A0%E7%9A%84%E5%BA%95%E9%83%A8%EF%BC%8C%E5%86%85%E5%AE%B9%E5%9C%A8%E5%85%83%E7%B4%A0%E9%87%8C%E9%9D%A2%0A%0AInsertion.After%EF%BC%9A%E5%B0%86%E5%86%85%E5%AE%B9%E6%8F%92%E5%85%A5%E5%88%B0%E5%85%83%E7%B4%A0%E5%90%8E%E9%9D%A2%EF%BC%8C%E5%86%85%E5%AE%B9%E5%9C%A8%E5%85%83%E7%B4%A0%E5%A4%96%E9%9D%A2%0A%0A%E4%BB%A5%E4%B8%8A%E7%9A%84%E8%BF%99%E4%BA%9B%E6%96%B9%E6%B3%95%E7%BB%8F%E5%B8%B8%E4%BC%9A%E4%BD%BF%E7%94%A8%E5%88%B0%E7%9A%84%EF%BC%8C%E4%B8%8D%E8%BF%87%E9%87%8C%E9%9D%A2%E6%9C%89%E5%BE%88%E5%A4%9A%E6%96%B9%E6%B3%95%E6%88%91%E4%B9%9F%E6%B2%A1%E6%9C%89%E4%BD%BF%E7%94%A8%E8%BF%87%EF%BC%8C%E6%9C%89%E4%BA%9B%E6%98%AF%E5%9C%A8%E7%BD%91%E4%B8%8A%E6%90%9C%E9%9B%86%E7%9A%84%EF%BC%8C%E6%9C%89%E7%9A%84%E6%98%AF%E5%9C%A8%E4%B9%A6%E4%B8%8A%E6%89%BE%E5%88%B0%E7%9A%84%EF%BC%8C%E9%87%8C%E9%9D%A2%E6%9C%89%E5%BE%88%E5%A4%9A%E5%9C%A8%E6%9C%80%E8%BF%91%E5%88%B6%E4%BD%9Cgoogle%E6%97%A5%E5%8E%86%E6%97%B6%E7%94%A8%E5%88%B0%E4%BA%86%EF%BC%8C%E5%9C%A8js%E5%88%9B%E5%BB%BA%E8%A1%A8%E6%A0%BC%EF%BC%8Cdiv%E4%BB%80%E4%B9%88%E8%99%BD%E7%84%B6%E5%85%B7%E6%9C%89%E6%8C%91%E6%88%98%EF%BC%8C%E6%AF%94%E8%B5%B7%E5%85%B6%E4%BB%96%E4%BD%BF%E7%94%A8%E8%B5%B7%E6%9D%A5%E9%BA%BB%E7%83%A6%E5%A4%9A%E4%BA%86%EF%BC%8C%E4%BD%86%E6%98%AF%E5%BE%88%E6%9C%89%E9%80%BB%E8%BE%91%E6%80%A7%E7%9A%84%E3%80%82%0A%E5%B8%8C%E6%9C%9B%E4%B8%8A%E9%9D%A2%E8%83%BD%E7%BB%99JavaScript%E7%9A%84%E5%AD%A6%E4%B9%A0%E4%BD%BF%E7%94%A8%E7%9A%84%E5%90%8C%E4%BB%81%E5%B8%A6%E6%9D%A5%E6%96%B9%E4%BE%BF%EF%BC%8C%E8%BF%99%E9%87%8C%E5%8F%AF%E6%98%AF%E5%AE%9E%E7%8E%B0Ajax%E7%9A%84%E5%85%B3%E9%94%AE%E5%9B%A0%E7%B4%A0%E3%80%82%0A%0A%E6%8F%90%E4%BE%9B%E7%BB%99%E5%A4%A7%E5%AE%B6%E5%8F%82%E8%80%83%E5%AD%A6%E4%B9%A0%EF%BC%8C%E8%BF%99%E6%98%AF%E7%BB%8F%E5%B8%B8%E7%94%A8%E5%88%B0%E7%9A%84%E3%80%82%0A" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

今天介绍一下 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的关键因素。

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