我的漫漫程序之旅
          

          專注于JavaWeb開發
          

          

          

          隨筆 - 39, 文章 - 310, 評論 - 411, 引用 - 0
          

          


          		
	
          

          

          
	
          
		
			
          
				數據加載中……
			
          
		          		
		
			
          
				
					
	
          
		
          
			Prototype1.6 實戰06 (Element續)
		
          
		
          
		
          <HTML>
          
           <HEAD>
          
            <TITLE>Element 02</TITLE>
          
            <script src="prototype.js" type="text/javascript"></script>
          
            <script>
          
                //Element.childElements() 返回該元素的所有子元素(并按順序)
          
                function childElementsTest()
          
                {
          
                    var ul = $('ul1').childElements();
          
          ul.each(          function(o,index)
          
                    {
          
            alert(          "index: " + index + " value: " + o.outerText);
          
          }          );
          
      }
          
                //previous() 方法返回上一個html元素的對象(注意是同級)
          
                function previousTest()
          
                {
          
          alert($('saying').previous().outerText);
          
      }
          
                //里面可以傳參數,從0開始，0代表向上一個,以此類推
          
                 function previousTest1()
          
                {
          
          alert($('saying').previous(          1).outerText);
          
                    //當然也可以直接指定$('saying').previous('h3'); 向上移動到h3元素
          
                    //也可以指定class選擇器
          
                    alert($('ida-red').previous('.yummy').outerText); 
          
      }
          
        
          
                function myNextSibling()
          
                {
          
                    //注意返回的是一個數組
          
                    var li = $('mutsu').nextSiblings();
          
          li.each(          function(i)
          
                    {
          
            alert(i.outerText);
          
          }          );
          
      }
          
            </script>
          
           </HEAD>
          
           <BODY>
          
              <ul id="ul1">
          
                  <li>a</li>
          
                  <li>b</li>
          
                  <li>c</li>
          
              </ul>
          

          
              <br />
          
              <input type="button" onclick="childElementsTest();" value="ChildElements test"/>
          
          <hr/>
          
              <ul id="fruits">   
          
                  <li id="apples">     
          
                      <h3>Apples</h3>     
          
                      <ul id="list-of-apples">       
          
                          <li id="golden-delicious" class="yummy">Golden Delicious</li>       
          
                          <li id="mutsu" class="yummy">Mutsu</li>    
          
                          <li id="mcintosh">McIntosh</li>      
          
                          <li id="ida-red">Ida Red</li>   
          
                      </ul>   
          
                      <p id="saying">An apple a day keeps the doctor away.</p> 
          
                  </li>
          
              </ul> 
          
              <br />
          
              <input type="button" value="previous test" onclick="previousTest();" />
          
              <input type="button" value="向上找２個" onclick="previousTest1();" />
          
              <input type="button" value="被觀察者" id="b1"/>
          
              <br />
          
              <input type="text" id="t1" />
          
              <br />
          
              <input type="button" id="b2" value="li的兄弟" onclick="myNextSibling();"/>
          
                  <input type="button" value="我在這" />
          
           </BODY>
          
           <script>
          
    (          function(){
          
                  //有點像觀察者模式
          
                  $('b1').observe('click',function(event)
          
                  {
          
            alert('您已經被監視');
          
                      //Event.element(event) 表示被觀察者對象
          
                      Event.element(event).value = "完了";
          
        }          );
          

          
        $('t1').observe('change',          function(event)
          
                  {
          
            alert('值已經改變');
          
            Event.element(event).value           = "";
          
        }          );
          
      }          )();
          
           </script>
          
          </HTML>
          

          
 

          



          
                                
                                
                                
          

		
          
		
          
			posted on 2008-07-24 13:12 々上善若水々 閱讀(253) 評論(0)  編輯  收藏  所屬分類: JavaScript 
		
          
	
          
	
	


	


          
	    
    




          








          

				
			
          
		          		
	
          
	
          
		
			

		
	
          

          


    







          
        
	




主站蜘蛛池模板：
余干县|
吉安市|
邢台县|
峨边|
昭通市|
仁寿县|
蒙城县|
新津县|
屏东市|
五原县|
西峡县|
竹山县|
潼关县|
深州市|
新河县|
崇阳县|
木里|
乌兰县|
庆城县|
八宿县|
加查县|
安庆市|
克东县|
台南县|
高要市|
伊春市|
南澳县|
桐城市|
长武县|
清苑县|
西华县|
蒲城县|
庆元县|
易门县|
汪清县|
临沂市|
江达县|
万州区|
南华县|
元谋县|
措美县|