1. Register and Download Xray, an XML, XSLT editor and processor.
2. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 2. A basic style sheet for the soccer results
use the XSLT as in the Listing 2 to transform the XML file as in the Listing 1.
(archive)
3. View the formatted HTML file.
4. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 3. A style sheet that computes team standings
compute the team standings in a table.
5. View the formatted HTML file.
星期一, 5月 30, 2011
Lab 36 XML
1. Register and Download Xray, an XML, XSLT editor and processor. (安裝X-Ray需要權限)
2. Before you do this lab,all the first you must know is
what is XML?
what is XSLT?
please write down your answer.
3. Given the the XML file and XSLT file ,
use Xray to do the transformation of the XML into HTML.
You have to replace [ with <.
4. View the formatted HTML file.
2. Before you do this lab,all the first you must know is
what is XML?
what is XSLT?
please write down your answer.
3. Given the the XML file and XSLT file ,
use Xray to do the transformation of the XML into HTML.
You have to replace [ with <.
4. View the formatted HTML file.
星期一, 5月 23, 2011
Lab 35 Programming in DOM
1. Open KompoZer
2. Based on the code as in
2. Based on the code as in
http://www.scottandrew.com/weblog/articles/dom_4 ,
write a code to generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags.
write a code to generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags.
Lab 34 Create Image using DOM
1. Open KompoZer
2. Hand code a javascript that loads an image from Internet based on
the DOM model.
3. Take a look at the sample code that shows how window.onload to load the image.
4. Use a button to load the image. Try how onclick works.
2. Hand code a javascript that loads an image from Internet based on
the DOM model.
3. Take a look at the sample code that shows how window.onload to load the image.
4. Use a button to load the image. Try how onclick works.
星期一, 5月 16, 2011
Lab 33 Hand code a form
Before you do this lab, you must understand what is CGI(Common Gateway Interface) and Form.
1. So please search the answer and post your opinion in your blog.
2. Hand code a HTML or use KompoZer to edit an HTML so that the webpage can send a request to Google like
http://maps.google.com/maps?q=24.9586,+121.24114
Use Form CGI that includes action, input, and submit.
Try a few different coordinates.
1. So please search the answer and post your opinion in your blog.
2. Hand code a HTML or use KompoZer to edit an HTML so that the webpage can send a request to Google like
http://maps.google.com/maps?q=24.9586,+121.24114
Use Form CGI that includes action, input, and submit.
Try a few different coordinates.
Lab 32 Lab Form and Action
- Dynamic pages, content generated by server-side programs.
- CGI, Common Gateway Interface, for sending requests to server-side programs.
static page
Ex:
http://www.google.com/
dynamic page
Ex:
http://www.cna.com.tw/
URL that sends a request by CGI
Ex:
http://maps.google.com/maps?q=24.9586,+121.2411
How to use Form to invoke a remote service through CGI.
1. Copy the search box of this search page,
inlcuding radio buttons, text input, and submit button.
2. Open your KompoZer HTML editor.
3. Open a new empty HTML file.
4. Paste the search box into this new file.
5. Use KompoZer to add a Form to this search box. Do not hand code the HTML. Just fill the blank in the Form dialog.
6. In the form dialog, set Action="http://google.com/search" and name of Form as "f" and method as "get"
(See Hint if it does not work.)
7. Save your file on your computer. Run your HTML by Firefox. What do you get?
8. Set method as "post"
9. Run your HTML by Firefox. What do you get?
星期一, 5月 09, 2011
被遺忘的今日科技之父 特斯拉
Nikola Tesla (1856-1943)其 實我們今日享受的電力，馬達，日光燈全部都是特斯拉(Tesla)的發明，Edison 藉由他的權勢攻擊抹黑Tesla 的創意，甚至為了貶低Tesla發明的電力系統，以極為荒謬的電殛流浪狗與馬匹的當眾實驗，試圖告訴世人，特斯拉發明的交流電是危險的，他的直流電才安 全，藉此操弄媒體與大眾的無知。其實安全與否，不在交流或直流，而是電壓高低，另外在電力輸配的考量下，可以容易變換電壓的交流電才真正可行，這也正是我 們今日所使用的電力系統。當Tesla發明雷達系統觀念，以對抗德國潛艇攻擊美國商船，然而愛迪生卻極力勸阻美國國防部，不可聽信Tesla，以致於過了 四分之一世紀，美國人才終於實現Tesla的雷達構想，然而已有不少無辜商船被德國潛艇擊沉。
Tesla 他才是19~20世紀最偉大的發明家，我們在今日依然用著他所發明的電力系統，馬達，然而幾乎沒有人知道這是他的貢獻。Tesla在86歲過世，死時身無分文。
儘管普羅大眾完全沒有聽過Tesla，科學界卻深切了解Tesla真正的學理原創性與洞察自然的思維，因此磁場單位，便是使用 T，讓後世永遠紀念 Tesla，正如電壓單位使用 V，紀念義大利人伏特(Volta)一般。
ps: 愛迪生發明了電椅，就是美國處死犯人的刑具。
體貼使用者的設計
注意到了嗎? Google Docs Excel 沒有儲存鍵
幾個月前，使用 Google Docs Excel ，文件打完後想要儲存，卻發現沒有儲存鍵。原來，只要打進去的內容，Google Docs Excel 都立即儲存，用完後直接離開就可以了，不必再按儲存鍵，真方便。萬一，這次打進的只是草稿，事後想洗掉，沒關係，只要使用版本回復，就可以倒退回去先前的 版本，使用者不必擔心。
儲存是古老的電腦設計概念，自有計算機語言就存在了。今日以使用者為中心的時代，其實"儲存"鍵是多餘的，使用者直覺認為打字進去的內容，電腦不就應該記住嗎? 停電，斷線，被登出應該都無礙。Google Docs Excel 驗證了這點。
幾個月前，使用 Google Docs Excel ，文件打完後想要儲存，卻發現沒有儲存鍵。原來，只要打進去的內容，Google Docs Excel 都立即儲存，用完後直接離開就可以了，不必再按儲存鍵，真方便。萬一，這次打進的只是草稿，事後想洗掉，沒關係，只要使用版本回復，就可以倒退回去先前的 版本，使用者不必擔心。
儲存是古老的電腦設計概念，自有計算機語言就存在了。今日以使用者為中心的時代，其實"儲存"鍵是多餘的，使用者直覺認為打字進去的內容，電腦不就應該記住嗎? 停電，斷線，被登出應該都無礙。Google Docs Excel 驗證了這點。
Static, Dynamic Webpages and Common Gateway
- Dynamic pages, content generated by server-side programs.
- CGI, Common Gateway Interface, for sending requests to server-side programs.
static page
Ex:
http://www.google.com/
dynamic page
Ex:
http://www.cna.com.tw/
URL that sends a request by CGI
Ex:
http://maps.google.com/maps?q=24.9586,+121.2411
星期一, 5月 02, 2011
Lab 31 Mash-Up 4 (Calendars)
建立你的行事曆，並與學校行事曆合併
Google日曆-中原大學行事曆-html版本<http://www.google.com/calendar/embed?src=sth4g0ns7lj48crs0gsm3ekuns%4...>
進入後按右下角+Google日曆即可訂閱
Lab 30 Mash-up 3 (Blogs)
Lab 29 Mash-up 2 (Maps)
真實案例
96年度全人關懷獎 -崔媽媽科技服務工作團隊
For housing services, compare the following two websites
http://www.housingmaps.com
http://yungching.housefun.com.tw/
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
96年度全人關懷獎 -崔媽媽科技服務工作團隊
For housing services, compare the following two websites
http://www.housingmaps.com
http://yungching.housefun.com.tw/
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
Lab 28 Mash-up 1 (Publish)
1. Upload a sample ppt to Google Docs.
2. Publish the uploaded ppt.
3. Embed the online ppt to your blog.
The reason to do so is that the readers don't have to have ppt to view your presentation. For example, some users work with Linux or Unix, and others work with MacOS. They will appreciate you for doing so.
範例:
如何活用 Gmail 工作坊
2. Publish the uploaded ppt.
3. Embed the online ppt to your blog.
The reason to do so is that the readers don't have to have ppt to view your presentation. For example, some users work with Linux or Unix, and others work with MacOS. They will appreciate you for doing so.
範例:
如何活用 Gmail 工作坊
訂閱：
文章 (Atom)