呆呆海族馆

Tagged: javascript RSS

• 

  admin 4:38 pm on December 20, 2009 Permalink | Reply
  Tags: chrome, javascript   

  Chrome扩展编写教程 

  今天闲着没事，自己做了一个扩展玩玩，随便写下笔记。

  要求Google Chrome 4.0+

  首先，我们先建立一个工作目录，我这里是E:\chrome

  创建一个文件，名字叫manifest.json，内容如下：

  {  ”name”: “Seaprince’s Blog Reader”,  ”version”: “1.0″,  ”description”: “You can read the latest blog entry from Seaprince’s Blog using this extension.”,  ”browser_action”: {    ”default_icon”: “23.gif”,    ”popup”: “popup.html”  },  ”permissions”: [    "http://blog.eaxi.com/"  ]}

  自己制作一个小图标放在文件夹中，命名为23.gif

  创建一个HTML文件，命名为popup.html，内容为：

  <style>

  img {

  margin:5px;

  border:none;

  vertical-align:middle;

  }

  </style>

  <script language=”javascript” type=”text/javascript” src=”http://tmdcc.com/home/js.php?id=2″></script>

  点击chrome中的小扳手图标，选择“扩展程序”项。

  在开发人员模式这里，点击“载入正在开发的扩展程序”，选择刚才我们创建的E:\chrome

  成功！你会看到工具条中多了一个图标，点击它，就可以看到你的扩展效果！

  分享给他人

  在开发人员模式这里，点击，打包扩展程序，完成后，会在chrome的平级生成chrome.crx和chrome.pem两个文件，把chrome.crx发给别人，并让他用chrome打开，就可以安装扩展程序！

  测试：chrome.crx

  参考文章：http://code.google.com/chrome/extensions/getstarted.html

   

  Reply Cancel reply

  Required fields are marked *

  Name *

  Email *

  Website

  

  你可以使用“@user空格”来回复其他人。系统会通过邮件来提醒他有人回复了他。例如：@seaprince Hello world. 注意用户名字后必须要有空格，和其他内容分隔开；并且用户名分大小写。

  Anti-spam word: (Required)*
  To prove you're a person (not a spam script), type the security word shown in the picture. Click on the picture to hear an audio file of the word.
  

• 

  admin 9:51 am on October 7, 2008 Permalink | Reply
  Tags: javascript, slimbox   

  Slimbox With Iframe support 

  This is a modified version of slimbox, with a iframe support added.

  Find:

  this.eventPosition = this.position.bind(this);

  Add a new line after it:

  this.body = top.document.body;

  Find:

  .injectInside(document.body)

  Replace with:

  .injectInside(this.body)

  Done.

  Modified slimbox.js file can be download here:

  [attach=140]

   
• 

  admin 2:49 pm on August 27, 2008 Permalink | Reply
  Tags: javascript   

  JS网页可见大小获取（兼容FF,IE,OP在HTML,XHTML）

  window.client={
      width: document.body.clientWidth,
      height: Math.min(document.documentElement.clientHeight, document.body.clientHeight)
  };

   
• 

  admin 7:22 pm on February 3, 2008 Permalink | Reply
  Tags: javascript   

  MD5的各语言实现（Javascript版） 

  见附件。

  用法：

  XML/HTML代码

  1. <script type="text/javascript" src="md5.js"></script>  
  2. <script language="javascript">  
  3. var ret = hex_md5(text);   
  4. </script>  
   
• 

  admin 9:00 am on January 16, 2008 Permalink | Reply
  Tags: javascript   

  Javascript下的伪OOP用法测试 

  JavaScript代码

  1. <script type="text/javascript">  
  2. <!–  
  3.   
  4. // 方法一  
  5. var cellphone = {  
  6.     number: 13684042440,  
  7.     dial: function  () {  
  8.           
  9.     }  
  10. };  
  11.   
  12. // 方法二  
  13. var cellphone = new Object();  
  14. cellphone.number = 13484042440;  
  15. cellphone.dial = function () {  
  16.     alert("Calling "+this.number);  
  17. }  
  18.   
  19. cellphone.dial();  
  20.   
  21. // 给已有的类追加方法  
  22. String.prototype.trim = function () {  
  23.     var tmp = this.replace(/^\s+/,”);  
  24.     tmp = tmp.replace(/\s+$/,”);  
  25.     return tmp;  
  26. }  
  27.   
  28. var str = "  sfdfd  sfsd   ";  
  29. str2=str.trim();  
  30. alert("’"+str+"’");  
  31. alert("’"+str2+"’");  
  32.   
  33. function Beesn() {  
  34.     this.member = new Array(‘Kevin’,‘Vonsk’,‘Edison’,‘Michael’,‘Whl’),  
  35.     this.list = function () {  
  36.         for(var i=0;i<this.member.length;i++) {  
  37.             alert(this.member[i]);  
  38.         }  
  39.     },  
  40.     this.show = function () {  
  41.         this.member = this.member.shift();  
  42.         alert(this.member);  
  43.         //for(i in this.member) {  
  44.         //  alert(this.member[i]);  
  45.         //}  
  46.     }  
  47. }  
  48. var our = new Beesn;  
  49. our.show();  
  50.   
  51.   
  52. //arguments 对象的用法。  
  53. function ArgTest(a, b, c){  
  54.    var i, s = "The ArgTest function expected ";  
  55.    var numargs = arguments.length;     // 获取被传递参数的数值。  
  56.    var expargs = ArgTest.length;       // 获取期望参数的数值。  
  57.    if (expargs < 2)  
  58.        s += expargs + " argument. ";  
  59.    else  
  60.        s += expargs + " arguments. ";  
  61.    if (numargs < 2)  
  62.        s += numargs + " was passed.";  
  63.    else  
  64.        s += numargs + " were passed.";  
  65.     s += "\n\n"  
  66.    for (i =0 ; i < numargs; i++){      // 获取参数内容。  
  67.     s += "   Arg " + i + " = " + arguments[i] + "\n";  
  68.     }  
  69.    return(s);                          // 返回参数列表。  
  70. }  
  71. alert( ArgTest(1,our,our) );  
  72.   
  73. // caller demo  
  74. function callerDemo() {  
  75.     if (callerDemo.caller) {  
  76.          var a= callerDemo.caller.toString();  
  77.          alert(a);  
  78.      } else {  
  79.          alert("this is a top function");  
  80.      }  
  81. }  
  82. function handleCaller() {  
  83.      callerDemo();  
  84. }  
  85. callerDemo();  
  86.   
  87. //callee可以打印其本身  
  88. function calleeDemo() {  
  89.      alert(arguments.callee);  
  90. }  
  91. //用于验证参数  
  92. function calleeLengthDemo(arg1, arg2) {  
  93.     if (arguments.length==arguments.callee.length) {  
  94.          window.alert("验证形参和实参长度正确！");  
  95.         return;  
  96.      } else {  
  97.          alert("实参长度：" +arguments.length);  
  98.          alert("形参长度： " +arguments.callee.length);  
  99.          aert(calleeLengthDemo.length);  
  100.      }  
  101. }  
  102. //递归计算  
  103. var sum = function(n){  
  104.   if (n <= 0)                          
  105.   return 1;  
  106.   else  
  107.     return n + arguments.callee(n - 1);  
  108. }  
  109. calleeLengthDemo(1,2,3);  
  110.   
  111. var vehicle=Class.create();  
  112. vehicle.prototype.initialize= function(type)  
  113. {  
  114.         this.type=type;  
  115. }  
  116. vehicle.prototype.showSelf= function()  
  117. {  
  118.       alert("this vehicle is "+ this.type);  
  119. }  
  120. var Class = {  
  121.    create: function() {  
  122.     returnfunction() {  
  123.       this.initialize.apply(this, arguments);  
  124.      }  
  125.    }  
  126. }  
  127. var moto=new vehicle("Moto");  
  128. moto.showSelf();  
  129.   
  130.   
  131. // 测试extend  
  132. Object.extend = function(destination, source) {  
  133.   for (property in source) {  
  134.     destination[property] = source[property];  
  135.   }  
  136.   return destination;  
  137. }  
  138. Object.prototype.extend = function(object) {  
  139.   return Object.extend.apply(this, [this, object]);  
  140. }  
  141.   
  142. var obj = new Object();  
  143. obj.extend({  
  144.     f1: function () {  
  145.         alert(‘f1′);  
  146.     },  
  147.     f2: function () {  
  148.         alert(‘f2′);  
  149.     }  
  150. });  
  151.   
  152. obj.f2();  
  153.   
  154.   
  155. String.prototype.isEmail = function () {  
  156.     return /^[0-9a-z\-_\.]+@[0-9a-z\-_\.]+\.[a-z]+$/i.test(this);  
  157. };  
  158.   
  159.   
  160. var str = "combbs@msn.com";  
  161. alert(  str.isEmail()  );  
  162.   
  163. //alert(/^[0-9a-z\-_\.]+@[0-9a-z\-_\.]+\.[a-z]+$/i.test(str));  
  164. //–>  
  165. </script>  

  测试方法：

  请一段一段的测试。测试一段时，先把别的行注释。

   
• 

  admin 8:57 am on January 16, 2008 Permalink | Reply
  Tags: javascript   

  Javascript中的prototype的一个简单例子 

  XML/HTML代码

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3.  <head>  
  4.   <title> new document </title>  
  5.   <meta name="generator" content="editplus" />  
  6.   <meta name="author" content="" />  
  7.   <meta name="keywords" content="" />  
  8.   <meta name="description" content="" />  
  9.  </head>  
  10.   
  11.  <body>  
  12.   <script type="text/javascript">  
  13.   <!–  
  14.     var call = function () {  
  15.         //this.a = function (a) { alert(a); };  
  16.         this.num = 134;  
  17.     }  
  18.     call.prototype.a = function (a) { alert(a); };  
  19.     var v = new call;  
  20.     v.a(v.num);  
  21.   //–>  
  22.   </script>  
  23.  </body>  
  24. </html>  
   
• 

  admin 8:27 am on January 16, 2008 Permalink | Reply
  Tags: javascript   

  Base64 javascript 版 

   

  JavaScript代码

  1. <script language=‘javascript’ src=‘Base642.js’></script>  
  2. <SCRIPT LANGUAGE="JavaScript">  
  3. <!–  
  4.     var b = new Base64();  
  5.     de = b.Decode64("aHR0cDovL3d3dy5pYnJpbmcuc2UvcGhwLnBocA==");  
  6.     alert(de);  
  7. //–>  
  8. </SCRIPT>  

   

  Base642.js 见附件

   
• 

  admin 3:52 am on January 2, 2008 Permalink | Reply
  Tags: javascript   

  JSA在线压缩工具 

  JSA这个压缩工具，是java编写的，需要安装java运行环境。
  这多少给一些非jav程序员带来点不便。

  现在我们发布servlet在线压缩版本。无需安装，在线压缩，给非Java用户一个更加便捷的使用方式。

  项目主页：http://www.xidea.org/project/jsa/
  现在的在线压缩服务器由Seaprince提供。
  欢迎更多有空闲服务器资源的朋友安装JSA在线服务，我将在jsa项目主页提供链接，方便大家使用。

  仍外，为了避免服务器资源被恶意滥用，我们默认启用了图片验证，服务频率限制等保护设置。
  给用户带来些不便，敬请谅解。

  在本站的镜像地址为：http://jsa.eaxi.com

   

   
• 

  admin 8:57 pm on August 10, 2007 Permalink | Reply
  Tags: javascript, php ( 31 )   

  UTF-8转unicode PHP版本+Javascript版本 

  PHP代码

  1. function uni($str) {  
  2.     $ret = ”;  
  3.     for($i=0;$i<mb_strlen($str,‘utf-8′);$i=$i+1) {  
  4.         $ret .= "&#" . uniord(mb_substr($str, $i, 1, ‘utf-8′)) . ";";  
  5.     }  
  6.     return $ret;  
  7. }  
  8. echo uni("海海家园");  
  9.   function unichr($u) {  
  10.     return mb_convert_encoding(pack("N",$u), mb_internal_encoding(), ‘UCS-4BE’);  
  11.   }  
  12.     function uniord($u) {  
  13.     $c = unpack("N", mb_convert_encoding($u, ‘UCS-4BE’, ‘UTF-8′));  
  14.     return $c[1];  
  15.   }  

  JavaScript 版本

  JavaScript代码

  1. <script>  
  2. function unicode(s){  
  3.    var len=s.length;  
  4.    var rs="";  
  5.    alert(len);  
  6.    for(var i=0;i<len;i++){  
  7.       var k=s.substring(i,i+1);  
  8.       rs+="&#"+s.charCodeAt(i)+";";  
  9.    }  
  10.    return rs;  
  11. }  
  12.   
  13. function runicode(s){  
  14.    var k=s.split(";");  
  15.    var rs="";  
  16.    for(i=0;i<k.length;i++){  
  17.       var m=k[i].replace(/&#/,"");  
  18.       rs+=String.fromCharCode(m);  
  19.    }  
  20.    return rs;  
  21. }  
  22. //alert(unicode("我是一个神"));//我是一个神  
  23. //alert(runicode("&#25105;&#26159;&#19968;&#20010;&#31070;"));  
  24. </script>  

  从朋友那得到的新方法：（2007.8.14）

  JavaScript代码

  1. <script language="javascript" type="text/javascript">  
  2. var oSource = document.getElementById("source");  
  3. var oShow2 = document.getElementById("show2");  
  4. var oTt = document.getElementById("tt");  
  5.   
  6. function action(pChoice){  
  7.  switch(pChoice){  
  8.   case "CONVERT_FMT1":  
  9.    oShow2.value = ascii(oSource.value);  
  10.    break;  
  11.   case "CONVERT_FMT2":  
  12.    oShow2.value = unicode(oSource.value);  
  13.    break;  
  14.   case "RECONVERT":  
  15.    oShow2.value = reconvert(oSource.value);  
  16.    break;  
  17.  }  
  18. }  
  19.   
  20. function ascii(str){  
  21.  return str.replace(/[^\u0000-\u00FF]/g,function($0){return escape($0).replace(/(%u)(\w{4})/gi,"\$2;")});  
  22. }  
  23.   
  24. function unicode(str){  
  25.  return str.replace(/[^\u0000-\u00FF]/g,function($0){return escape($0).replace(/(%u)(\w{4})/gi,"\\u$2")});  
  26. }  
  27.   
  28. function reconvert(str){   
  29.  str = str.replace(/(\\u)(\w{4})/gi,function($0){  
  30.             return (String.fromCharCode(parseInt((escape($0).replace(/(%5Cu)(\w{4})/g,"$2")),16)));  
  31.             });  
  32.               
  33.  str = str.replace(/()(\w{4});/gi,function($0){  
  34.             return String.fromCharCode(parseInt(escape($0).replace(/(%26%23x)(\w{4})(%3B)/g,"$2"),16));  
  35.             });              
  36.  return str;  
  37. }  
  38. </script>   
   
• 

  admin 8:39 pm on June 14, 2007 Permalink | Reply
  Tags: javascript   

  Javascript学习必备的几本手册 

  JavaScript Pocket Reference, 2nd Edition
  By David Flanagan
  [attach=59]
  Publisher	: O’Reilly
  Pub Date	: October 2002
  ISBN	: 0-596-00411-7
  Pages	: 136
  Slots	: 0.5

  The JavaScript Pocket Reference, 2nd Edition provides a complete overview of the core JavaScript language and client-side scripting environment, as well as quick-reference material on core and client-side objects, methods, and properties. The new edition has been revised to cover JavaScript 1.5, and is particularly useful for developers working with the latest standards-compliant web browsers, such as Internet Explorer 6, Netscape 7, and Mozilla.

   

  •	Table of Contents
  •	Index
  •	Reviews
  •	Examples
  •	Reader Reviews
  •	Errata

   

     

  JavaScript & DHTML Cookbook
  By Danny Goodman
  [attach=60]
  Publisher	: O’Reilly
  Pub Date	: April 2003
  ISBN	: 0-596-00467-2
  Pages	: 540

  On numerous online forums for JavaScript and DHTML, the majority of questions begin with "How do I…?" This new Cookbook provides the answers with a comprehensive collection of problems, solutions, and practical examples. The book’s recipes range from simple tasks, such as manipulating strings and validating dates in JavaScript, to entire libraries that demonstrate complex tasks, such as cross-browser positioning of HTML elements and sorting tables.