能夠數個人一起討論簡報，是個不錯的功能。
Happy New Year！
2007年12月31日 星期一
2007年12月28日 星期五
期末報告題目
我挑選的是Laszlo in 10 minutes裡Scripting的範例部分--Event Handlers
Scripting意思就是"事件"，能夠借由"邏輯運算"來判斷事件真偽和類似If else的敘述，來達到"控制物件"的目地。
一些物件的特性都能輕易地改變、控制，所以我挑選這個令我雀喜的範例。
code：(replace'<'和'>'to'['和']')
[canvas]
[button onclick="vw.setWidth(200)"]Expand Width[/button]
[!--定義button，並設定事件：當按下button(Expand Width)時，改變id為vm的物件寬度為200 --] [button x="120" onclick="vw.setWidth(100)"]Reset[/button]
[!--定義button，並設定事件：當按下button(Reset)時，改變id為vm的物件寬度為100 --]
[view id="vw" y="30" width="100" height="100" ]
[!--定義一開始要show出來的物件(vm) --]
[!-- onwidth is sent anytime width is changed --]
[handler name="onwidth" ]
this.setAttribute('bgcolor', (this.width > 100 ? red : blue));
[!--利用handler裡的'onwidth'當物件(vm)改變寬度時，會有所動作。所以我們可利用邏輯運算來描述想要的改變：控制顏色(bgcolor)當此物件(vm)寬度大於100則顯示紅色，否則顯示藍色--]
[/handler]
[/view]
[/canvas]
[!-- Copyright 2006 - 2007 Laszlo Systems, Inc. All rights reserved. Use subject to license terms. --]
效果：
這個範例中有設定id名稱，也就是設定物件，雖然只有單一物件，但若擴及數個物件，並描述它們之間的互動關係，那我想這個物件導向的設計將會更有體會它的好處。
裡面還有button的onclick，也是事件的一種，能夠改變某一物件的狀態(此範例是width)，不過這範例特別在於又透過onclick後的參考值當變數去啟動另一個事件(onwidth)以再改變(bgcolor)，這種類似鏈子串聯起來的事件在動態網頁上伴演很重要的角色。
高中時曾玩過flash，做動態網頁去比賽，裡面的action script不外乎也是物件導向的設計，但它更結合各種向量變化、繪畫功能(例如顏色漸層)，來提供更完整的物件運動。我個人是比較著迷於flash所做出來的華麗網頁，不過也是有缺點，無法像JaveScript還能夠結合HTML設計網頁。
感謝老師這學期的教學，讓自己學習到很多不一樣的知識，我很喜歡老師的課，沒有壓力，卻能夠學得比其他課來得更多。
Scripting意思就是"事件"，能夠借由"邏輯運算"來判斷事件真偽和類似If else的敘述，來達到"控制物件"的目地。
一些物件的特性都能輕易地改變、控制，所以我挑選這個令我雀喜的範例。
code：(replace'<'和'>'to'['和']')
[canvas]
[button onclick="vw.setWidth(200)"]Expand Width[/button]
[!--定義button，並設定事件：當按下button(Expand Width)時，改變id為vm的物件寬度為200 --] [button x="120" onclick="vw.setWidth(100)"]Reset[/button]
[!--定義button，並設定事件：當按下button(Reset)時，改變id為vm的物件寬度為100 --]
[view id="vw" y="30" width="100" height="100" ]
[!--定義一開始要show出來的物件(vm) --]
[!-- onwidth is sent anytime width is changed --]
[handler name="onwidth" ]
this.setAttribute('bgcolor', (this.width > 100 ? red : blue));
[!--利用handler裡的'onwidth'當物件(vm)改變寬度時，會有所動作。所以我們可利用邏輯運算來描述想要的改變：控制顏色(bgcolor)當此物件(vm)寬度大於100則顯示紅色，否則顯示藍色--]
[/handler]
[/view]
[/canvas]
[!-- Copyright 2006 - 2007 Laszlo Systems, Inc. All rights reserved. Use subject to license terms. --]
效果：
這個範例中有設定id名稱，也就是設定物件，雖然只有單一物件，但若擴及數個物件，並描述它們之間的互動關係，那我想這個物件導向的設計將會更有體會它的好處。
裡面還有button的onclick，也是事件的一種，能夠改變某一物件的狀態(此範例是width)，不過這範例特別在於又透過onclick後的參考值當變數去啟動另一個事件(onwidth)以再改變(bgcolor)，這種類似鏈子串聯起來的事件在動態網頁上伴演很重要的角色。
高中時曾玩過flash，做動態網頁去比賽，裡面的action script不外乎也是物件導向的設計，但它更結合各種向量變化、繪畫功能(例如顏色漸層)，來提供更完整的物件運動。我個人是比較著迷於flash所做出來的華麗網頁，不過也是有缺點，無法像JaveScript還能夠結合HTML設計網頁。
感謝老師這學期的教學，讓自己學習到很多不一樣的知識，我很喜歡老師的課，沒有壓力，卻能夠學得比其他課來得更多。
2007年12月17日 星期一
Homework 12-10-2007
1. List three ways of creating interactive webpages.
一、CGI：透過CGI可以讓所瀏覽的網頁與網頁伺服器端戶動。例如隨時在變動的新聞、股市資訊。
二、DOM&Java scripts：因為Java是直譯語言，不需要安裝任何檔案就可以直接應用於瀏覽器，讓瀏覽器直接與網頁互動。例如：google map的縮放大效果。若再透過物件導向設計的DOM方法，將能整合XML和HTML之間的關係。例如：igoogle個人首頁。
三、XSLT：透過XSLT的指令可將較不易瀏覽的XML文件轉換成自己所想要的HTML網頁。
四、ASP&ActaveX：微軟所開發的動態網頁伺服器，透過ActaveX技術讓每個使用者擁有自己想要的資料網頁。
2. Lab DOM and Javascript.
Lab DOM and JavaScript
一、CGI：透過CGI可以讓所瀏覽的網頁與網頁伺服器端戶動。例如隨時在變動的新聞、股市資訊。
二、DOM&Java scripts：因為Java是直譯語言，不需要安裝任何檔案就可以直接應用於瀏覽器，讓瀏覽器直接與網頁互動。例如：google map的縮放大效果。若再透過物件導向設計的DOM方法，將能整合XML和HTML之間的關係。例如：igoogle個人首頁。
三、XSLT：透過XSLT的指令可將較不易瀏覽的XML文件轉換成自己所想要的HTML網頁。
四、ASP&ActaveX：微軟所開發的動態網頁伺服器，透過ActaveX技術讓每個使用者擁有自己想要的資料網頁。
2. Lab DOM and Javascript.
Lab DOM and JavaScript
2007年12月10日 星期一
Lab Create Img using DOM
3. Use window.onload to load the image.
4. Use a button to load the image. Try how onclick works.
4. Use a button to load the image. Try how onclick works.
2007年12月3日 星期一
Homework 11-26-2007
1.
a.試解釋Web技術演進是要解決什麼樣的問題?
第二時期CGI技術的使用，主要是利用程序(Process)來存取資料，解決了在第一時期要更新資料的繁瑣。
第三時期CGI技術更加成熟，利用執行緒(Thread)取代程序，解決了在第二時期服務一位使用者就要開一個程序的效率問題。
b.程序(Process)和執行緒(Thread)對網站性能有什麼不同的影響?
程序的技術使用是指每當要提供新的一位使用者服務時，就得開一個新的程序來服務。當有大量使用者需要服務時，就會導致網站速度明顯下降，甚至有可能當機的餘慮。
執行緒的技術使用就比較smart，在server內已經提供Daemon的服務，使用者需要哪種服務，只須找出相對應的執行緒去服務它即可。效率較佳。
2.What does a CGI output contain in the HTTP header? Hint: Such as Content-type
當CGI資料輸出，會透過Stdout方式送出給伺服程式，即HTTPD，再傳送回給HTTP。但為了讓www伺服主機能分辨資料型態，CGI輸出前，會先送出MIME資訊(資料檔)。ex:Content-type:mp3/html
3.If you want to upload an mp3 file, should you use the GET or POST method? Why?
POST，因為get的傳輸方式是將資料直接加在 URI 之後，會有傳輸資料大小的限制(1K)，而POST容許傳送大量資料，一首mp3通常至少有5MB以上。
a.試解釋Web技術演進是要解決什麼樣的問題?
第二時期CGI技術的使用，主要是利用程序(Process)來存取資料，解決了在第一時期要更新資料的繁瑣。
第三時期CGI技術更加成熟，利用執行緒(Thread)取代程序，解決了在第二時期服務一位使用者就要開一個程序的效率問題。
b.程序(Process)和執行緒(Thread)對網站性能有什麼不同的影響?
程序的技術使用是指每當要提供新的一位使用者服務時，就得開一個新的程序來服務。當有大量使用者需要服務時，就會導致網站速度明顯下降，甚至有可能當機的餘慮。
執行緒的技術使用就比較smart，在server內已經提供Daemon的服務，使用者需要哪種服務，只須找出相對應的執行緒去服務它即可。效率較佳。
2.What does a CGI output contain in the HTTP header? Hint: Such as Content-type
當CGI資料輸出，會透過Stdout方式送出給伺服程式，即HTTPD，再傳送回給HTTP。但為了讓www伺服主機能分辨資料型態，CGI輸出前，會先送出MIME資訊(資料檔)。ex:Content-type:mp3/html
3.If you want to upload an mp3 file, should you use the GET or POST method? Why?
POST，因為get的傳輸方式是將資料直接加在 URI 之後，會有傳輸資料大小的限制(1K)，而POST容許傳送大量資料，一首mp3通常至少有5MB以上。
訂閱：
文章 (Atom)