prototypeの最上位要素のテスト



 
  
  
  
  
  1. <html> 
  2.     <head> 
  3.         <title> </title> 
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  5.         <script src="prototype.js"> 
  6.         </script> 
  7.         <script> 
  8.             var Person = Class.create(); 
  9.             Person.prototype = { 
  10.                 initialize: function(){ 
  11.                 }, 
  12.                 name: '', 
  13.                 birthday: '', 
  14.                 age: '', 
  15.                 Show: function(){ 
  16.                     alert("This is " + this.name); 
  17.                 } 
  18.             }; 
  19.             function TestPerson(){ 
  20.                 var p = new Person(); 
  21.                 p.name = "Tom"
  22.                 p.age = 4
  23.                 p.birthday = "1983-6-1"
  24.                 p.Show(); 
  25.             }; 
  26.             var User = Class.create(); 
  27.              
  28.             User.prototype = { 
  29.                 initialize: function(){ 
  30.                 }, 
  31.                 userid: '', 
  32.                 Report: function(){ 
  33.                     alert("UserID:" + this.userid + "   Name:" + this.name + "   Age:" + this.age + "  Birthday:" + this.birthday); 
  34.                 } 
  35.             }; 
  36.             Object.extend(User.prototype, Person.prototype); 
  37.             function TestUser(){ 
  38.                 var user = new User(); 
  39.                 user.name = "Jim"
  40.                 user.age = 4
  41.                 user.userid = 2396 
  42.                 user.birthday = "1983-9-1"
  43.                 user.Show(); 
  44.                 user.Report(); 
  45.                  
  46.             } 
  47.              
  48.             function ShowPrototypeInfo(){ 
  49.                 alert(Prototype.Version + "   " + Prototype.ScriptFragment); 
  50.             } 
  51.              
  52.             function TestInspect(){ 
  53.                 var s = "51cto"
  54.                 alert(Object.inspect(s)); 
  55.             } 
  56.              
  57.             //------------------------------------------------------- 
  58.             function testFunctionBind(){ 
  59.                 var person = new Person(); 
  60.                 person.name = "Charli"
  61.                 person.age = 4
  62.                 person.birthday = "1983-10-1"
  63.                 var user = new User(); 
  64.                 user.name = "Tom"
  65.                 user.age = 5
  66.                 user.userid = 2396 
  67.                 user.birthday = "1988-12-25"
  68.                 var handler = user.Report.bind(person); 
  69.                 handler(); 
  70.             } 
  71.              
  72.             var Listener = new Class.create(); 
  73.             Listener.prototype = { 
  74.                 initialize: function(btn, message){ 
  75.                  
  76.                     $(btn).onclick = this.showMessage.bindAsEventListener(message); 
  77.                 }, 
  78.                 showMessage: function(message){ 
  79.                     alert(message); 
  80.                 } 
  81.             }; 
  82.             var listener = new Listener("testEventListener", " !"); 
  83.         </script> 
  84.         <body> 
  85.             <input type=button value="ShowPrototypeInfo" onclick='return ShowPrototypeInfo();'/> Prototype  
  86.             <br> 
  87.             <hr><input type=button value="TestPerson" onclick='return TestPerson();'/> Person p    
  88.             <br> 
  89.             <input type=button value="TestUser" onclick='return TestUser();'/>User Person , User    
  90.             <br> 
  91.             <input type=button value="TestInspect" onclick='return TestInspect();'/> Object Inspect  
  92.             <br> 
  93.             <input type=button value="testFunctionBind" onclick='return testFunctionBind();'/> Object FunctionBind  
  94.             <br> 
  95.             <input type=button value="testEventListener" id="testEventListener" />testEventListener 
  96.             <br> 
  97.             <script> 
  98.                 var Listener = new Class.create(); 
  99.                 Listener.prototype = { 
  100.                     initialize: function(btn, message){ 
  101.                         this.message = message; 
  102.                         $(btn).onclick = this.showMessage.bindAsEventListener(this); 
  103.                     }, 
  104.                     showMessage: function(){ 
  105.                         alert(this.message); 
  106.                     } 
  107.                 }; 
  108.                 var listener = new Listener("testEventListener", " !"); 
  109.             </script> 
  110.             <hr> 
  111.             <script> 
  112.                 function TimeExe(){ 
  113.                     var timerExe = new PeriodicalExecuter(showTime, 1); 
  114.                      
  115.                 } 
  116.                  
  117.                 function showTime(){ 
  118.                     var time = new Date(); 
  119.                     var d = $('myDiv'); 
  120.                     d.innerHTML = time
  121.                 } 
  122.             </script> 
  123.             <div id="myDiv"> 
  124.                 <p> 
  125.                     This is a paragraph 
  126.                 </p> 
  127.                 <input type="button" value=  onclick="TimeExe();"> 
  128.                 <br> 
  129.             </div> 
  130.             <hr> 
  131.             <script> 
  132.                 function TestNumber(){ 
  133.                     var n = 50
  134.                     var b = 3
  135.                     alert(n.toColorPart()); 
  136.                     alert(n.succ()); 
  137.                     alert(b.toPaddedString()); 
  138.                     //b.times(alert()); 
  139.                 } 
  140.             </script> 
  141.             <input type="button" value='Number ' onclick="return TestNumber();"/> 
  142.             <br> 
  143.         </body> 
  144.         </html> 

 
本文は「喬磊のブログ学習進歩」ブログから出ており、必ずこの出典を残してください.http://sucre.blog.51cto.com/1084905/413328