Javascript

在網頁裡面用 Select 是很常遇到的，之前也寫了一篇如何利用 jQuery 動態增加 option 或取值，jQuery 部份就不介紹了，那是需要搭配 jQuery Plugin: Select box manipulation，今天要介紹的是如何用 javascript 動態取值或者是增加 option 選項。因為我發現有使用者直接利用 innerHtml 的方式來把資料塞入到 Select 裡面，雖然 FireFox 或 Chrome 都可以正常運作，但是遇到 IE 還是沒辦法動。

如何取得 select element 底下很多方法可以取得 select element: 1. 透過 form name + element name

document.myform.selectname

document.myform.elements

document.getElementById("selectid")

在這裡跟大家推薦一本國外的書籍，也就是 Elated.com 網站作者 Matt Doyle 推出的一本新書 Master Mobile Web Apps with jQuery Mobile，此作者也有推出 PHP 及 Photoshop 的書籍，本人相當佩服有美工天份又會寫程式人才。然而現在當紅的 Mobile Device，大家相繼為了 iOS, Android 或其他手持式裝置撰寫 Web 介面，目前網路上大家推的其中一套就是 jQuery Mobile，而我呢，正在摸索另一套強大的 Web App Framework: Sencha Touch，功能來比的話，個人覺得 Sencha Touch 優勢比較多，之後有機會再來寫一系列的 Sencha Touch 文章。此書有提供目錄可以參考，該作者會教大家如何搭配 PHP 跟 MySQL 結合 jQuery Mobile API 來撰寫程式，書籍應該是蠻完整的，目前售價美金19元，如果有興趣的人可以上網下單。

NodeJS 是目前當紅的 Web 2.0 技術，去年 COSCUP 2010 就有 KKBOX 資深工程師 ericpi 來探討這個議題，NodeJS 背後使用了 V8 引擎為基礎，沒看過用純 JS 來當 Server-Side 吧，台灣很紅的 Plurk 也是大量使用 NodeJS，然而每開發一種語言，就會想開始找搭配的 Framework，那就首推 Node Framework Express 來撰寫程式，本篇是要介紹如何在 Ubuntu 10.10 無痛安裝 nodejs + express。

下載 Nodejs 原始碼 直接到

官網下載 Stable 的版本吧，目前是 node-v0.4.10.tar.gz，也可以先看看 API Document

# wget http://nodejs.org/dist/node-v0.4.10.tar.gz

還不知道 JSON 是什麼嘛？本篇教學會帶您瞭解 JSON 在網站上的應用，以及運作流程跟使用 PHP 和 JavaScript 來處理 JSON。假如您現在的工作就是網站設計師，相信一定聽過 JSON，但是什麼是 JSON，它能夠做什麼，及您能透過它在網站上做到哪些事情呢？

透過本篇介紹您可以瞭解基本的 JSON，底下會列出本篇會提到的重點：

• 什麼是 JSON
• JSON 應用在哪些地方
• 如何建立 JSON 字串
• 一個簡單的 JSON 範例
• JSON vs XML
• 如何透過 PHP 及 JavaScript 使用 JSON

什麼是 JSON

JSON 是個以純文字為基底去儲存和傳送簡單結構資料，你可以透過特定的格式去儲存任何資料(字串,數字,陣列,物件)，也可以透過物件或陣列來傳送較複雜的資料。一旦建立了您的 JSON 資料，就可以非常簡單的跟其他程式溝通或交換資料，因為 JSON 就只是個純文字格式。

JSON 的優點如下:

• 相容性高
• 格式容易瞭解，閱讀及修改方便
• 支援許多資料格式 (number,string,booleans,nulls,array,associative array)
• 許多程式都支援函式庫讀取或修改 JSON 資料

之前寫了一篇 jQuery 偵測瀏覽器版本, 作業系統(OS detection)，這次可以來加上 Android 手機版本，其實就是分析瀏覽器 User Agent 來達到目的，底下分享 PHP 跟 Javascript 作法

PHP 方法

if(stripos($_SERVER['HTTP_USER_AGENT'],'Android') !== false) 
{
	header('Location: http://android.xxx.com');
	exit();
}

Javascript 方法

if(navigator.userAgent.match(/Android/i))
{
	window.location = 'http://android.xxx.com';
}

Apache .htaccess 方法 用

Apache mod rewrite 方法

RewriteCond %{HTTP_USER_AGENT} ^.*Android.*$
RewriteRule ^(.*)$ http://android.xxx.com [R=301]

update: 簡易版的偵測 iphone/ipod time: 23:32 jQuery 真是一個相當方便的 javascript framework，最近在弄嵌入式系統時候需要去偵測瀏覽器 user agent，就類似下此訊息 “Mozilla/4.0 (compatible; MSIE 4.01; Windows 95)"，原本打算直接用 C 語言內建的 getenv(“HTTP_USER_AGENT”) 來做掉，不過後來想想，直接在 UI 那邊，利用 jQuery 來偵測瀏覽器版本、系統OS，這樣就解決了，上網找到有人寫了 jQuery browser and OS detection plugin，利用底下語法就可以知道一些 user agent 裡面的資料