顯示具有 js 標籤的文章。 顯示所有文章
顯示具有 js 標籤的文章。 顯示所有文章

2017/10/13

JS - 重複組合

給兩個序列 a 跟 b ，在不改變 a 和 b 序列順序的情況下，列出所有 a 跟 b 混合後的結果 使用[重複組合](https://zh.wikipedia.org/wiki/%E7%B5%84%E5%90%88#.E9.87.8D.E8.A4.87.E7.B5.84.E5.90.88.E7.90.86.E8.AB.96.E8.88.87.E5.85.AC.E5.BC.8F)的概念，兩個序列混合後的結果等同於其中一個序列的 index 的組合 舉例來說序列 a 為 `--`，序列 b 為 `**`，其所有混和結果為： ``` --** -*-* *--* -**- *-*- **-- ``` 共六種，而我們可以把 a 序列所在的 index 寫出： ``` 1,2 1,3 2,3 1,4 2,4 3,4 ``` 而這是 C4取2 的所有組合結果。 假設已知 b 序列長度為 6，我們可以使用迴圈生成組合。 ``` var set = { "a":['b','b','b','b'], "b":['3','4','5','6','7','8'] } var n = set['a'].length + set['b'].length; var c = []; for(var i1 = 0 ; i1 < n ; i1 ++) for(var i2 = i1+1 ; i2 < n ; i2 ++) for(var i3 = i2+1 ; i3 < n ; i3 ++) for(var i4 = i3+1 ; i4 < n ; i4 ++) for(var i5 = i4+1 ; i5 < n ; i5 ++) for(var i6 = i5+1 ; i6 < n ; i6 ++){ var ab = []; for(var i = 0 ; i < n ; i ++) ab.push('a'); ab[i1] = 'b'; ab[i2] = 'b'; ab[i3] = 'b'; ab[i4] = 'b'; ab[i5] = 'b'; ab[i6] = 'b'; var c0 = []; var index = {"a":0,"b":0}; for(var i = 0 ; i < n ; i ++){ c0.push(set[ab[i]][index[ab[i]]]); index[ab[i]] = index[ab[i]] + 1; } c.push(c0); console.log(c0); } ```
作者： 卡卡米 於 凌晨12:19 0 個回應
標籤： ,

2016/10/17

chrome extension - long finger 瀏覽器擴充功能開發紀錄

注意：本文中有許多連結必須手動複製貼上到網址列上才能正確開啟(chrome 開頭的那些網址)

long finger 簡介

long finger 安裝網址 : https://chrome.google.com/webstore/detail/long-finger/aammiagfeadjchafpeeiacggolmfnmmo

點子以及圖片資源是由 Leggy 提供，感謝 Leggy。

這是一個會把滑鼠游標從食指改成中指的擴充功能。他沒什麼用，唯一的作用應該是舒壓吧。實作起來相當容易，程式碼也足夠短，很適合作為一個練手的作品。


擴充功能簡介


chrome 擴充功能入口：chrome://extensions/

在這個頁面可以看見目前安裝的所有擴充功能。如果只是單純嘗試開發，還沒打算上架的話，在這裡有一個「開發人員模式」的按鈕，先把他打勾。


這樣就可以安裝還沒發佈到 google 商店的擴充功能。一個擴充功能的核心檔案是manifest.json，我們可以透過特定網址去找到任一擴充功能的 manifest.json，網址格式為：

chrome-extension://擴充功能ID/manifest.json

舉例來說，在安裝好 long finger 之後開啟網址：
chrome-extension://aammiagfeadjchafpeeiacggolmfnmmo/manifest.json
會看到：
{
   "browser_action": {
      "default_icon": "longFinger.png"
   },
   "content_scripts": [ {
      "css": [ "longFinger.css" ],
      "js": [ "longFinger.js" ],
      "matches": [ "http://*/*", "https://*/*" ]
   } ],
   "description": "This extension change cursor index finger to long finger.",
   "key": "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAlWMwgzcpj1/kt1KbNVUbvQRth2wvV2WX9RKRxJ1aWAsovQjEWKytM2pkbZ2xbm/V9tSNODZW438PfS46IV12iE3aTIc0mbHDML3ScJZeBfKs8dFIt0nxWERpIVctS2xQIUPS4mfKsWdk6LckPuHQmFyz13hR13hbUoqz7DkCqWv3Sz5sbDZbqKBg9GZliWUjeafzOTjkT3rO5khVqmT8NcfJ0TYAe1sJ4u2PpHByC8+dT0iQsE6xEz2/gG66HwnpU4HibcyAujfAy4fcgOmWfL8kcm4HcvFqJ+C8s3jtlUxm8o6rzrNtw+w30r5NLLdC+GcSjw3Z9zeF4U+3swa7mQIDAQAB",
   "manifest_version": 2,
   "name": "long finger",
   "update_url": "https://clients2.google.com/service/update2/crx",
   "version": "3.0"
} 
manifest.json 是整個擴充功能的起始點，透過 manifest.json 的設定，你可以觸發其他的程式檔。我們可以看見這裡有幾個重要的檔案連結：

 chrome-extension://aammiagfeadjchafpeeiacggolmfnmmo/longFinger.css
chrome-extension://aammiagfeadjchafpeeiacggolmfnmmo/longFinger.js

 這兩個檔案落在 content scripts 中。content_scripts 有三個參數，分別是 matchs、css、js。當使用者開啟網頁時，若網址符合 matches 的規則，就會將 css 跟 js 附加在該網頁上。


long finger 實作


讓我們把注意力放在 longFinger.css 和 longFinger.js 上。

先來看看 longFinger.css：
a{
 cursor: url("http://etrex.tw/a/flippers3.gif"),auto !important;
}
button{
 cursor: url("http://etrex.tw/a/flippers3.gif"),auto !important;
}
.longFinger{
 cursor: url("http://etrex.tw/a/flippers3.gif"),auto !important; 
}
longFinger.css 上寫的是只要是 a 或 button 或是任何帶有 longFinger class 的 html tag 就會把游標改為 http://etrex.tw/a/flippers3.gif。

接下來看看 longFinger.js：
document.querySelector('body').addEventListener("mousemove", function(e){
 var target = e.target;
 var cursor = window.getComputedStyle(target,null).getPropertyValue("cursor");
 if(cursor == "pointer"){
  target.classList.add("longFinger");
 }
});
longFinger.js 寫著，當滑鼠在整個網頁上移動時，檢查目前游標指著的元素(element)是否造成游標為食指形狀，如果是的話，就幫這個元素加上 longFinger class。

這樣就大功告成了！


擴充功能測試


我已將 long finger 放在 github 上：https://github.com/etrex/long-finger。你可以在 github 上面看到資料夾結構是由一個資料夾 long finger 下帶著四個檔案所組成：manifest.json、longFinger.js、longFinger.css、longFinger.png。

只要下載long finger 資料夾，並且在 chrome://extensions/ 選擇載入未封裝的擴充功能，然後選擇 long finger 資料夾，就可以完成擴充功能的安裝。
作者： 卡卡米 於 凌晨12:51 0 個回應
標籤：

2015/2/6

新手該學什麼語言作入門：javascript

朋友貼這個連結給我：http://blog.turn.tw/?p=1283 ，他說覺得有點有趣。

關於新手該學什麼語言作入門，其實我想過。

對於新手來說最困難的不是程式。

最困難的是建立可執行程式的環境。

所以首選絕對是 javascript！

不用安裝IDE，直接用chrome 按 F12 切到 console 就能寫。

如果你要存檔，記事本也能寫，學會後立刻可以作 chrome 外掛，瞬間變潮潮！

學會 javascript 之後再來就是學HTML ，可以在 dropbox 的 public 空間放自己做好的 HTML 檔，馬上成為朋友圈內第一個學會作網頁的人！

入門容易，又可以混口飯吃的語言不多，javascript至少還可以混個10年飯，何不學 javascript？

需要安裝的語言 / 資料庫完全不適合新手阿。

如果你說 javascript 能作的事太少，其實只要學會 jsonp，後台可以全用別人(朋友)的，基本上想做什麼還是能作得出來。
作者： 卡卡米 於 下午6:20 1 個回應
標籤： , ,

2014/4/6

盲解滑塊 / Blindfold Sliding Puzzle

最近看了一些影片，說明記憶力跟腦力是可以經過訓練得到改善的。



我的記憶力很不好，所以想來訓練一下，也許盲解益智遊戲會是個不錯的選項。我只有看過盲解魔術方塊，不過那對於一個想訓練記憶力的初學者來說太難。所以我想滑塊會是一個比較簡單，適合練習盲解的遊戲。

滑塊的遊戲目標是排出剛進入遊戲時的畫面，隨機彩色版則必須在進入遊戲時先背下目前的色表。

在盲解模式下，第一次的移動將會觸發盲解，點選 Normal 或 Blindfold 選擇遊戲類型，然後使用鍵盤的[W][S][A][D] 或 [↑][↓][←][→]進行遊戲，按Enter等同於按下右邊的按鈕。

不熟悉滑塊遊戲進行方式的玩家可以先試著用數字板練習，如果由上而下解，就是先排123，先排出下圖：

２３
１＊＊
＊＊＊

然後用 [→] [→] [↑] 就可以排出第一排了，456以此類推，78會自動排好。

彩色方塊版：https://etrex.tw/js/sliding_puzzle/SlidingPuzzle.html


這也是我第一個純JS的遊戲，之前都作FLASH的。
作者： 卡卡米 於 凌晨2:36 0 個回應
標籤： ,

2013/12/13

閱讀 jquery 原始碼的筆記 - I don't like this

I_dont_like_this = function (key)
{
var nodes = document.querySelectorAll(key);
var l = nodes.length;
for(var i = 0; i <  l ; i++)
{
var node = nodes[i];
node.parentNode.removeChild(node);
}
}
I_dont_like_this("iframe.fb_ltr");
I_dont_like_this(".fb_iframe_widget");

這是我剛寫好，專門隱藏網站外掛FB按讚功能的函數，準備作成 chrome 外掛

document.querySelectorAll 這東西是瀏覽器內建的選擇器

我爬 jQuery 在第6456行找到的
作者： 卡卡米 於 晚上8:48 0 個回應
標籤： ,

2013/12/6

閱讀 jquery 原始碼的筆記 - Array.slice 的妙用

在 jquery v1.10.2 裡面的第 232行寫到 :

toArray: function() {
return core_slice.call( this );
}

他的功能是把 jquery 物件從物件 {} 轉換成陣列 []
在這裡的 this 是個 jquery 物件
而 core_slice 是宣告在第 55 行 :

core_deletedIds = [],
core_slice = core_deletedIds.slice,

以上來自第48行和第55行
我們知道他宣告了一個變數  core_slice 把陣列的 slice 函數拿來用
 slice 能作什麼事呢?

從這裡我們知道執行

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1,3);

會得到

citrus = ["Orange","Lemon"];

的結果

根據測試我發現 core_slice.call(A) 的運作模式是先判斷 A 有無 length 屬性
如果有就 new 一個新的陣列 然後把對應的元素丟進新的陣列裡，如果沒有傳入參數的話就是全丟進去
嘗試實作看看 :

function slice(A, start, end) {
    var output = [];
    if (start == undefined) start = 0;
    if (end == undefined) end = A.length;
    if (start < 0) start = A.length + start;
    if (end < 0) end = A.length + end;
    for (var i = start; i < end; i++) {
        output.push(A[i]);
    }
    return output;

}

試用起來跟內建的一樣
可以測試以下程式碼

var o = {};
o.length = 5;
o[0] = 1;
slice(o);
[].slice.call(o);

作者： 卡卡米 於 下午4:37 0 個回應
標籤： ,

閱讀 jquery 原始碼的筆記 - && 和 || 運算子的妙用


在 jquery v1.10.2 裡面的第 153行寫到:

context && context.nodeType ? context.ownerDocument || context : document,

它的實際意義是
如果 context 不存在 或者 context 沒有 nodeType 屬性時，傳回 document
如果 context 存在，而且 context 具有 nodeType 屬性時，嘗試傳回 context.ownerDocument ，如果 context.ownerDocument 不存在就改成傳回 context

為什麼可以這樣寫 ?

運算子 && 的功能

執行 A && B 假如A可以轉換為 false 就 return A 否則 return B

試著實作 function and(A,B){ if(Boolean(A) === false) return A; return B;}

結果發現 A && B 跟 and(A, B) 的運作結果完全相同

運算子 || 的功能

執行 A || B 假如 A 可以轉換為 true 就 return A 否則 return B

試著實作 function or(A,B){ if(Boolean(A) === true) return A; return B;}

結果發現 A || B 跟 or(A, B) 的運作結果完全相同



附上可以轉換為 false 的物件列表 (從這裡找到的)
0
-0
null
""
false
undefined
NaN
除了這些東西之外 丟進 Boolean 都會傳回 true


作者： 卡卡米 於 下午3:05 0 個回應
標籤： ,

2012/10/1

移除畫面上的 flash 時清除 flash 所占用的記憶體?


=== 目標 ===



  移除畫面上的 flash 時能夠清除 flash 所占用的記憶體


=== 實驗 ===



假設操作 HTML 字串等於操作記憶體
新增 Object Tag 增加記憶體使用量
移除 Object Tag 減少記憶體使用量


畫面上放兩個按鈕
  addFlash
  removeFlash

按一下 addFlash 新增一個 Object Tag
按一下 removeFlash 移除所有 Object Tag


=== 實作 ===


  === HTML的部分 ===


<a href="#" id="addFlash">add flash</a>
<a href="#" id="removeFlash">remove flash</a>
<div id="flashContainer"></div>


  === js的部分 ===

  $(function(){
      $("#addFlash").click(function(){
          var random  = 'a' + Math.floor(Math.random() * 1000000000);
          $("#flashContainer").append('<div id="'+ random+ '" />');
          swfobject.embedSWF("test.swf", random , "908", "560", "10.0.0");
      });

      $("#removeFlash").click(function(){
          $("#flashContainer").html("");
      });
  });


=== 實驗結果 ===



chrome, firefox, safari在按下removeFlash時
系統記憶體使用量在1秒內明顯下降，好像沒按過addFlsah一樣

但是 IE 不意外，在按下removeFlash時
系統記憶體使用量開始緩緩下降，過了一分鐘還沒降到該降到的位置

不知道 IE 怎麼達到移除 flash 時釋放記憶體?

(其實也不能說他沒有釋放，只是他釋放得很慢)

作者： 卡卡米 於 下午3:27 0 個回應
標籤： , ,

2012/3/9

HTML5 Canvas eraser demo using EaselJS

原理
  html5 canvas 的橡皮擦怎麼作?
  用context.globalCompositeOperation
  根據Canvas Composite Operations Tutorial & Demo
  我們知道只要寫

    context.globalCompositeOperation = "destination-out"

  就可以作出橡皮擦功能
  但我們不直接用他
  因為我們要透過 EaselJS 來操作 canvas
  所以我們變成要寫

  DisplayObject.compositeOperation = "destination-out";

demo

code

<html>
<head>
    <title></title>
    <script type="text/javascript" src="../lib/easel.js"></script>
    <script type="text/javascript" src="../lib/jquery-1.7.1.js"></script>
    <script type="text/javascript">
        $(function(){
            var canvas = $("#canvas")[0];
            var stage = new Stage(canvas);
            var shape1 = new Shape();
            var shape2 = new Shape();
            var color = "rgba(255,0,0,1)";
            shape1.graphics.setStrokeStyle(16, "round", "round")
                    .beginStroke(color)
                    .moveTo(100, 300)
                    .lineTo(300, 100)
                    .endStroke();
            shape2.graphics.setStrokeStyle(16, "round", "round")
                    .beginStroke(color)
                    .moveTo(100, 100)
                    .lineTo(300, 300)
                    .endStroke();
            shape2.compositeOperation = "destination-out";
            stage.addChild(shape1);
            stage.addChild(shape2);
            stage.update();
        });
    </script>
    </head>
<body>
<canvas id="canvas" width="640" height="480"></canvas>
</body>
</html>

這是用 http://tohtml.com/ 貼code的功能，感覺還不錯
作者： 卡卡米 於 下午4:26 0 個回應
標籤： , ,

2012/2/24

JS OOP class template

JS的物件導向類別範本


為了節省大家的時間

我在看完了物件導向那篇文章之後

參考 EaselJS 寫了一個 class 的範本

彩色code : http://paste.plurk.com/show/913157/

黑白code :


(function(window){
    var MyClass = function(){
        //繼承類別的建構式
        繼承類別.call(this,建構式參數);
        //建構式
        this.initialize();
    }
    //繼承類別
    var p = MyClass.prototype = new 繼承類別();
 
    //static property 靜態屬性
    MyClass.屬性 = 1;
    MyClass.方法 = function(){};
 
    //public method 公開方法
    p.方法 = function(){};
 
    //private method 私有方法
    var 方法 = function(){};
 
    //建構式
    p.initialize = function(){
        //public variable 公開屬性
        this.屬性 = 1;
     
        //private variable 私有屬性
        var 屬性 = 1;
    }
 
    //把類別名稱掛在全域上
    window.MyClass = MyClass;
}(window));
作者： 卡卡米 於 下午5:19 0 個回應
標籤：

2012/2/23

JS link

排整齊code的
http://jsbeautifier.org/

邊做邊學 jquery 系列
http://blog.miniasp.com/post/2009/04/19/Learning-jQuery-from-novice-to-expert-in-just-two-hours.aspx

JS的物件導向類別範本
http://etrex.blogspot.com/2012/02/js-oop-class-template.html

使用物件導向技術來建立進階 Web 應用程式
http://msdn.microsoft.com/zh-tw/magazine/cc163419.aspx

Browser 與 Server 持續同步的作法介紹 (Polling, Comet, Long Polling, WebSocket)
http://www.josephj.com/entry.php?id=358

Node入門 » 一本全面的Node.js教學課程
http://www.nodebeginner.org/index-zh-tw.html

jQuery API
jQuery API

深入理解JavaScript系列http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html

AjaxML
http://www.ajaxml.com/

jQuery Chop Slider
http://www.idangero.us/cs-wp/

圖表產生
Flotr2

翻頁效果 turn.js
http://www.turnjs.com/#home

Adipoli jQuery Image Hover Plugin - 圖片特效
http://jobyj.in/adipoli/

ajaxshake - js UI收集
ajaxshake

Parse JavaScript Object Online
http://etrex.tw/static/etrexJs/ObjectTreeview/InteractiveTreeview.html

Jsonp Proxy
http://etrex.blogspot.com/2011/01/jsonp-proxy-using-python-and-google-app.html

poogle
http://poogle.emotionviz.com/

2012 年 Github 上最多星星的 JavaScript Library
http://www.icoding.co/2013/02/top-starred-js-on-github

上傳圖片模組
http://blueimp.github.io/JavaScript-Load-Image/

YOU MIGHT NOT NEED JQUERY
http://youmightnotneedjquery.com/

50 JavaScript Libraries for Charts and Graphs
http://techslides.com/50-javascript-charting-and-graphics-libraries/
作者： 卡卡米 於 上午11:26 0 個回應
標籤： ,

2012/2/16

backbone.js 入門


要用 backbone 之前要先載入 underscore 和 jQuery

backbone是js的一個MVC framework
backbone的主要功能分為兩塊:Model 和 View
他們透過 backbone.Event 來溝通

Model: 負責維護 client, server, view 資料的同步
　　　　當Model內的資料被修改，就會驅動 change Event

View: 負責 html render 和 UI event
　　　　可以 html template 來做 render
　　　　不一定要同時使用 Model 和 View
　　　　從Todo這個範例可以看到 單獨使用 View 是可行的
　　　　從這行開始看，可以發現這段程式碼其實是用 View 去接管所有的 UI event
　　　　而這段程式碼中只有在 event 觸發的函數內使用到 Model

　　　　我自己也做了一個測試


backbone 還有一個重要的東西是 Router
Router 的功能是用來做 deep linking
deep linking 技術是改變client網址卻不換頁，只改變了網頁中的某個部分
其實等於是用網址來存client的狀態，這樣做的好處是在轉貼連結可以直接跳到頁的內部
舉例來說我的網頁
http://dl.dropbox.com/u/7377053/JS/etrexJs/ObjectTreeview/InteractiveTreeview.html
在文字框輸入變數名稱可以用來偷看js變數
http://dl.dropbox.com/u/7377053/JS/etrexJs/ObjectTreeview/InteractiveTreeview.html#navigator.userAgent
http://dl.dropbox.com/u/7377053/JS/etrexJs/ObjectTreeview/InteractiveTreeview.html#YAHOO

感謝龍哥的補充
作者： 卡卡米 於 下午3:22 0 個回應
標籤： ,

server-side javascript 入門

server-side js 指的是用 js 這個語言
去做一些 php 或 asp 原本要做的事

需要一個專門執行 server-side js 的 server
就像 php server 要裝一些軟體一樣

server-side js 要安裝 node.js

因為執行時是在 server 上執行
所以他當然可以跟server-side的檔案系統和資料庫溝通

server-side 也用 js 寫的好處是前後臺相同的程式碼可以只寫一份
舉例來說
ajax 網頁通常是先開啟網頁後再用 ajax 載入資料
此時要做 html render 需要寫一些 js
但 html render 的工作在後端也會有
如果後端是不同語言 就要維護兩份 code
作者： 卡卡米 於 下午2:50 0 個回應
標籤： ,

2012/2/8

js 的 mouseDown mouseMove 在手機上不能使用的解法

因為手機上使用的 event 是 touchStart 和 touchMove

國外的神人有解，下面是註冊 touch 事件再轉發 mouse 事件的程式

var mouseEventTypes = {
touchstart : "mousedown",
touchmove : "mousemove",
touchend : "mouseup"
};

for (originalType in mouseEventTypes) {
document.addEventListener(originalType, function(originalEvent) {
event = document.createEvent("MouseEvents");
touch = originalEvent.changedTouches[0];
event.initMouseEvent(mouseEventTypes[originalEvent.type], true, true,
window, 0, touch.screenX, touch.screenY, touch.clientX,
touch.clientY, touch.ctrlKey, touch.altKey, touch.shiftKey,
touch.metaKey, 0, null);
originalEvent.target.dispatchEvent(event);
});
}
作者： 卡卡米 於 下午5:58 0 個回應
標籤：

2011/3/21

plurk api test

http://cgm.cs.ntust.edu.tw/etrex/etrexJs/plurk/plurkjsonpdemo.html
作者： 卡卡米 於 下午2:17 0 個回應
標籤： , ,

2011/1/15

jsonp proxy

我們知道 jsonp 是需要 server side 支援才有可能辦到
比方說userAgentString.com不支援 jsonp
API介紹
用法

所以我們需要另一台 server 去讀取上面的 json 然後支援 jsonp
正好已經有webetrex.appspot.com幫我們作這件事了
API介紹
用法

所以我們可以實驗一下效果
到Parse JavaScript Object Online
import 這個 jsonp
就會看到正確的完成任務
作者： 卡卡米 於 下午2:25 0 個回應
標籤： ,

正式介紹 Parse JavaScript Object Online

Parse JavaScript Object Online
是一個用來爬 Object 物件結構
以自動完成和 treeview 來顯示
來達到觀察別人 code 的功能

網址 : http://cgm.cs.ntust.edu.tw/etrex/etrexJs/ObjectTreeview/InteractiveTreeview.html


目前支援的功能：
　1. 外部匯入js
　2. treeview
　3. 自動完成
　4. deeplinking


使用方法：
　當你在文字方塊內輸入的字有意義時，就會執行功能 2 3 4
　當你點下 treeview 身上的節點時，就會執行功能 2 3 4
　當你覺得你要看的 js 沒在裡面時可以使用功能 1
　因為 deeplinking 的關係，所以可以這樣用
　　#YAHOO.lang.trim
　　#$.trim
　　#dojo.trim


使用範例：
輸入物件名稱
　　#etrex
　　#jQuery
　　#window
　　#document
輸入運算式
　　#new Array("T","E","S","T")
　　#2*Math.PI
　　typeof navigator.mimeTypes
　　$.isFunction(parseObject)



我是作者

如果有什麼問題或意見可以提出
作者： 卡卡米 於 凌晨12:35 0 個回應
標籤： ,

2011/1/12

Javascript Detect Device and Browser

根據這個網頁在每個瀏覽器開出來的結果

我寫了以下的程式，可以用來判斷client端的設備和瀏覽器

etrex.Util.GetDevice = function(){
    var detectArray = ["iPad","iPod","iPhone","Windows","Macintosh"];
    var str = "";
    for(var index in detectArray)
    if(navigator.userAgent.indexOf(detectArray[index])!= -1)
        return detectArray[index];
    return "unknown";
}
etrex.Util.GetBrowser = function(){
    var detectArray = ["Chrome","Firefox","MSIE 8.0","MSIE 7.0","MSIE 6.0","Opera","Safari"];
    var str = "";
    for(var index in detectArray)
    if(navigator.userAgent.indexOf(detectArray[index])!= -1)
        return detectArray[index];
    return "unknown";
}


和一個實際的 Demo，看不到demo結果的人可能是昨天已經快取到etrex.js這個檔案，需要清除一下快取。

如果看到結果是 unknown，那就表示我沒有把你的設備或瀏覽器加到 detectArray，這時候就可以看一下這篇的第一句話上面的兩個連結，然後把該加的字串加到detectArray裡面。
作者： 卡卡米 於 上午11:55 0 個回應
標籤：

2011/1/11

Parse JavaScript Object Online

為了快快樂樂學習js而作的一個函數

功能是把js Object轉成jQuery Treeview所需的html碼

可以用來觀察 js object 結構

以下是結果 有興趣的人可以看一下原始碼

Parse JavaScript Object Online
作者： 卡卡米 於 下午3:16 0 個回應
標籤： ,
訂閱： 文章 (Atom)