talangniao 发表于 2013-2-7 20:40:34

http://www.blogjava.net/supercrsky/articles/216978

Prototype1.6 实战05    (Element)

<div class="postText"><div style="border: 1px solid #cccccc; padding: 4px 5px 4px 4px; font-size: 13px; width: 98%; background-color: #eeeeee;">http://www.blogjava.net/Images/OutliningIndicators/None.gif<HTML>
http://www.blogjava.net/Images/OutliningIndicators/None.gif <HEAD>
http://www.blogjava.net/Images/OutliningIndicators/None.gif  <TITLE> Element </TITLE>
http://www.blogjava.net/Images/OutliningIndicators/None.gif<script src="prototype.js" type="text/javascript" /></script>
http://www.blogjava.net/Images/OutliningIndicators/ExpandedBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedBlock.gif<style>http://www.blogjava.net/Images/dot.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif    .luck
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif    {http://www.blogjava.net/Images/dot.gif}{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        color :  red;
http://www.blogjava.net/Images/OutliningIndicators/ExpandedBlockEnd.gif    }
http://www.blogjava.net/Images/OutliningIndicators/None.gif</style>
http://www.blogjava.net/Images/OutliningIndicators/ExpandedBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedBlock.gif  <script>http://www.blogjava.net/Images/dot.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        function _insert()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{    
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            //检查d1元素内是否有值
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            if(!$('d1').empty())
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif            http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif                alert($('d1').outerText);
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif            }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            //第一人参数<position,即要在哪添加>,第二个参数即要添加的内容
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            Element.insert("d1","<input type='text' />");
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            //直接指定元素的insert也可以,直接在参数里传内容
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            $('d1').insert("<img src='' />");
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        function _remove()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            $('d1').remove();
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            //或用Element.remove('d1');
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        function _replace()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            $('d1').replace("<div id='d1'>QQ</div>");
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        function _addClass()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            $('t1').addClassName('luck');
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        function _removeClass()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            $('t1').removeClassName('luck');
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        function _hide()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            $('t1').hide();
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif        function _show()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            $('t1').show();
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        }
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/ExpandedBlockEnd.gif  </script>
http://www.blogjava.net/Images/OutliningIndicators/None.gif </HEAD>
http://www.blogjava.net/Images/OutliningIndicators/None.gif
http://www.blogjava.net/Images/OutliningIndicators/None.gif <BODY>
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <div id="d1">
http://www.blogjava.net/Images/OutliningIndicators/None.gif            dtest
http://www.blogjava.net/Images/OutliningIndicators/None.gif    </div>
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="button" value="添加" onclick="_insert();"/>
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="button" value="替换" onclick="_replace();"/>
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="button" value="删除" onclick="_remove();"/>
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="text" value="请注意查看文字颜色" id="t1"/>
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="button" value="添加class" onclick="_addClass()" />
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="button" value="移除class" onclick="_removeClass()" />
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="button" value="隐藏" onclick="_hide()" />
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <input type="button" value="显示" onclick="_show()" />
http://www.blogjava.net/Images/OutliningIndicators/None.gif    <div id="framer">   <img src="http://www.baidu.com/img/baidu.gif" alt="点此还原为原来大小" onclick="$('framer').undoClipping();"/> </div> 
http://www.blogjava.net/Images/OutliningIndicators/None.gif </BODY>
http://www.blogjava.net/Images/OutliningIndicators/ExpandedBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedBlock.gif <script>http://www.blogjava.net/Images/dot.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif    (function()
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif        http://www.blogjava.net/Images/dot.gif{
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif            //剪切层的大小 
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockStart.gifhttp://www.blogjava.net/Images/OutliningIndicators/ContractedSubBlock.gif            $('framer').makeClipping().setStyle(http://www.blogjava.net/Images/dot.gif{width: '100px' ,height: '100px'});
http://www.blogjava.net/Images/OutliningIndicators/ExpandedSubBlockEnd.gif        })();
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif
http://www.blogjava.net/Images/OutliningIndicators/InBlock.gif    
http://www.blogjava.net/Images/OutliningIndicators/ExpandedBlockEnd.gif </script>
http://www.blogjava.net/Images/OutliningIndicators/None.gif</HTML>
http://www.blogjava.net/Images/OutliningIndicators/None.gif
页: [1]
查看完整版本: http://www.blogjava.net/supercrsky/articles/216978