s9926167 羅世雄: 3月 2014

2014年3月24日星期一

Lab 16 Change an image by moving the mouse

1. Design a webpage to display picture A initially.
2. Try to move the mouse. When the mouse is not within the area of the picture, picture A remains the same. When the mouse is within the area of the picture, display picture B in place.

You can use the photo in
http://minstral.blogspot.tw/2013/06/blog-post.html
for picture A and the photo in
http://minstral.blogspot.tw/2013/05/blog-post_30.html
for picture B.

Hint: You may find the example useful.
Hint: If you have a problem displaying a picture on the browser, you can check out the example.

===================================

Lab 15 九九乘法表

1. Open notepad++
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.

============================================
Lab 15 The 99 Product Table will show below.

<html>
<head>
<meta content="text/html; charset=ISO-8859-1"http-equiv="content-type">
<title>Lab 15</title>
<p><b>The 99 Product Table will show below.</b></p>
<tab><input type="button" value="99 ProductTable" onclick="buildTable()"></tab>
<script>
function buildTable(){
docBody = document.getElementsByTagName("tab").item(0)
myTable = document.createElement("TABLE")
myTable.id ="TableOne"
myTable.border = 1
myTableBody = document.createElement("TBODY")
for (i = 1; i <= 9; i++){
row = document.createElement("TR")
for (j = 1; j <= 9; j++){
cell = document.createElement("TD")
cell.setAttribute("WIDTH","50")
cell.setAttribute("HEIGHT","50")
textVal = i+"*"+j+"="+i*j
textNode = document.createTextNode(textVal)
cell.appendChild(textNode)
row.appendChild(cell)
}
myTableBody.appendChild(row)
}
myTable.appendChild(myTableBody)
docBody.appendChild(myTable)
}
</script>
</head>
<body id="body">
</body>
</html>

Lab 14 Create Image using DOM

1. Open notepad++
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.

=============================
lab14 The image will show on bottom of this web page.

<html>
<head>
<title>lab14</title>
<p><b>The image will show on bottom of this web page.</b></p>
<form action="javascript:void(0);" id="exampleForm">
<button onclick="build()">I am image button</button>
<br />
</form>

<script>
function build()
{
myImg=document.createElement("IMG")
myImg.setAttribute("id","imageOne")

myImg.setAttribute

("src","http://i19.photobucket.com/albums/b158/shongle/CUTE%20PET/pipi08a.jpg")

docBody = document.getElementsByTagName("body").item(0)
var body = document.getElementById("exampleForm");
body.appendChild(myImg)
}
</script>
</head>
<body>
<br />
</body>
</html>

2014年3月17日星期一

Lab 13 Regular expression in action II

題目:

撰寫一個網頁能夠自動檢查輸入的字串是否為網址(例如
163.17.9.5
www.cycu.edu.tw
是合法網址

123.222.2
999.999.999.999
www.cycu
不是合法網址)

==========================
<html>
<head>
</head>
<body id="body">
<form action="javascript:void(0);" id="exampleForm">
<input id="examplePass" />
<input type="submit" />
</form>
</body>
<script>

</script>
</html>

Lab 12 Regular expression in action

題目:Write a form to send a query to Google maps. If the input is not in the format of coordinates, display an error and ask the user to retry. For example, an incorrect input may look like 12.a2,21.22

===============================
<html>
<head>
</head>
<body id="body">
<form action="https://maps.google.com/" id="exampleForm" method="get" name="q" onsubmit="return check()">
<input id="examplePass" name="q" type="text" />
<input type="submit" value="submit" />
</form>
</body>
<script>

document.getElementById("exampleForm").onsubmit = function(){
var passwordRegex =/^([+-]?)(180|(1[0-7][0-9](\.)?(\d)?(\d)?(\d)?(\d)?(\d)?(\d)?)|([0-9]?[0-9](\.)?(\d)?(\d)?(\d)?(\d)?(\d)?(\d)?)),([+-]?)(90|(([0-8]?[0-9])|([0-8]?[0-9](\.)(\d)(\d)?(\d)?(\d)?(\d)?(\d)?)))$/;

if(!passwordRegex.test(document.getElementById("examplePass").value)){
console.log("Regex didn't match");
return false;
var notify = document.getElementById("notify");
if(notify === null){
notify = document.createElement("p");
notify.textContent = "ERROR";
alert("錯誤!Incorrect format");
notify.id ="notify";
var body =document.getElementById("body");
body.appendChild(notify);
}
}
};
</script>
</html>

Lab 11 Regular Expression II

所求:

撰寫一個網頁能夠自動檢查輸入的字串是否為"整數或小數，逗號，整數或小數"格式(例如 24.9586,121.24114)

-------------------------------------------

<html>
<head>
</head>
<body id="body">
<form action="javascript:void(0);" id="exampleForm">
<input type="text" id="examplePass" />
<input type="submit" />
</form>
</body>
<script>

document.getElementById("exampleForm").onsubmit =function() {
var passwordRegex = /^[+-]?\d*(\.\d*)?,[+-]?\d*(\.\d*)?$/;

if(!passwordRegex.test(document.getElementById("examplePass").value)){
console.log("Regex didn't match");
var notify = document.getElementById("notify");
if (notify === null){
notify = document.createElement("p");
notify.textContent = "輸入的字串必須為有意義的"整數或小數，逗號，整數或小數"格式！"
notify.id = "notify";

var body = document.getElementById("body");
body.appendChild(notify);
}
}
};

</script>
</html>
-------------------------------------------------
下圖為輸入正確示意圖

Lab 10 Regular expression I

所求:
撰寫一個網頁能夠自動檢查輸入的字串是否為整數或小數(例如 12.34, -1.2, +0.02, .30)。

－－－－－－－－－－－－－－－－－－－－－

<html>
<head>
</head>
<body id="body">
<form action="javascript:void(0);" id="exampleForm">
<input type="text" id="examplePass" />
<input type="submit" />
</form>
</body>
<script>

document.getElementById("exampleForm").onsubmit =function() {
var passwordRegex = /^[+-]?\d*(\.\d*)?$/;

if(!passwordRegex.test(document.getElementById("examplePass").value)){
console.log("Regex didn't match");
var notify = document.getElementById("notify");
if (notify === null){
notify = document.createElement("p");
notify.textContent = "輸入的字串必須為有意義的整數或小數！"
notify.id = "notify";

var body = document.getElementById("body");
body.appendChild(notify);
}
}
};

</script>
</html>
-------------------------------------------------
下圖為輸入正確示意圖

Homework 3/10/2014: Lab 8 Using browsers for programming II

要求：撰寫一個網頁能夠自動檢查輸入的密碼，長度必須至少六個字元，且必須至少包含一個數字以及一個非英文字母的字元。

－－－－－－－－－－－－－－－－－－－－－

<html>
<head>
</head>
<body id="body">
<form action="javascript:void(0);" id="exampleForm">
<input type="password" id="examplePass" />
<input type="submit" />
</form>
</body>
<script>

document.getElementById("exampleForm").onsubmit =function() {
var passwordRegex = /^(?=.*\d)(?=.*[\W_]).{6,}$/;

if(!passwordRegex.test(document.getElementById("examplePass").value)){
console.log("Regex didn't match");
var notify = document.getElementById("notify");
if (notify === null){
notify = document.createElement("p");
notify.textContent = "長度必須至少六個字元，且必須至少包含一個數字以及一個非英文字母字元(無輸入順序)。"
notify.id = "notify";

var body = document.getElementById("body");
body.appendChild(notify);
}
}
};

</script>
</html>
－－－－－－－－－－－－－－－－－
下圖為"未達要求"時示意圖

2014年3月10日星期一

Lab 9 使用Google Docs 下OX 棋

題目:

1. 兩人一組

2. 其中一人開啟 Google Docs

3. Create 一個新文件，然後把權限分享給夥伴

4. 開始下棋 (共同編輯)

結果:

我(羅世雄)跟王偉兆

Lab 8 Using browsers for programming II

要求：撰寫一個網頁能夠自動檢查輸入的密碼，長度必須至少六個字元，且必須至少包含一個數字以及一個非英文字母的字元。

－－－－－－－－－－－－－－－－－－－－－

Lab 7 Using browsers for programming

題目要求:撰寫一個網頁能夠自動檢查輸入的密碼，長度必須至少六個大寫或小寫字元或數字。

Homework 3/3/2014 Amy Cuddy: Your body language shapes who you are

　　我看的是Amy Cuddy的"你的姿勢決定你是誰"，看完覺得真是很實用又非常有助益的一場好演說阿！講師提到"人的生理會影響心理，心理會影響行為，行為會影響結果。"並建議大家從行為上調整來讓自己邁向成功之路，也就是"小調整會造成大改變"，令我感到有如當頭棒喝一般，驚覺到也許過去自己的部份失敗經驗，很可能就是導因於"當下的姿勢"給他人的觀感不佳所致。而且此講座內容很類似我以前看過的一本書《人性的弱點》－－書中教導人們如何從觀察對方身體的小動作，來判斷對方的心理狀態並預測其接下來會做的決定和行為。我個人認為很實用，恰好自己個性也是喜歡"觀察周遭"的人，已經很習慣藉由觀察他人身體動作來分析如何應對的方法，所以對此講座主題的結論老實說並不感到意外(笑)。

　　不過此講座仍有讓我頗感興趣的部份，尤其是經過2分鐘實驗後的High-Power姿勢和Low-Power姿勢的人們，居然在測量唾液中的睪固酮(支配性荷爾蒙)和腎上腺皮質醇(壓力荷爾蒙)，會有這麼明顯的差距！？強勢者睪固酮會升高而腎上腺皮質醇下降，弱勢者則相反，真是很有趣的實驗結果。但是與其稱為強勢者和弱勢者，不如改成"有自信的人"和"沒自信的人"吧！有自信的人給他人觀感較好也容易成功，沒自信的人則相反。另外後半段講師提到自己年輕時的經驗，"即使自己當下感覺不配，但先假裝自己是成功的，最終也將會成功！"的故事也帶給我很大啟發，感覺就像是將錯就錯而因禍得福，甚至像是"自我催眠"的理論一樣。如果未來能模仿此方法去逼迫自己成功，就算起初會有點心虛、沒自信，但我相信最終若有好結果的話也是非常值得的。
　　
　　從此講座我學到了人若想要變得有自信而邁向成功，平時就該訓練自己從改變行為上做起。尤其在面對巨大壓力前先在有隱私的地方，花幾分鐘模仿具有高度自信的姿勢，讓自己由生理影響心理，久而久之就能逐漸成為一個有自信而不怕壓力的人。當然基本實力的累積也很重要，因此平時仍要多充實自己能力，畢竟機會是留給有準備的人！

2014年3月3日星期一

Lab 6：Using Chrome

最耗時的三個元件:

CYCU:

1.runinfo.jsp

2.im13.jpg

3.newsbox.jsp

Youtube:

1.www.youtube.com

2.http://pagead2.googlesyndication.com/activeview?id=lidar2&v=104&adk=1&p=100…1280,1024&tt=1105&pt=1&deb=1-1-1-3-4-6&url=http%3A%2F%2Fwww.youtube.com%2F

3.http://csi.gstatic.com/csi?v=2&s=youtube&action=gli&pt=239&yt_spf=0&yt_li=1&e=935501,910207,923302,914062,916612,940316,937417,937416,913434,936910,936913,902907,3300062,3300101,3300130,3300137,3300161,3310366,3310628,3310649&yt_lt=cold&ei=lH4UU_bNEKrnmAWnnYHYDg&srt=169&rt=ce.172,cl.174,bf.1926,hr.2321,je.2599,jl.2604,ol.2695,aft.2695,fpt.2313&it=st.1622,req_.65,rcv_.1863

Udacity:

1.https://www.udacity.com/media/js/udacity/udacity.min.js?4353f3facd4c92187fd07d419bddaca6

2.partner-nvidia.png

3.https://www.udacity.com/media/js/external/libs.min.js?4353f3facd4c92187fd07d419bddaca6

Lab 5：Using Labels

標籤設置試做，新增＂標籤label＂和＂網路大學＂和＂網路耗時元件＂等等...於右側標籤欄位

Lab 4：破解網路大學排名DIY

1.網頁數(Size)
中原 : Google約有 1,290,000 項結果
台大 : Google約有 817,000 項結果
中正 : Google約有 1,430,000 項結果
元智 : Google約有 277,000 項結果

2.連結度(能見度 Visibility)
中原 : Google約有 2513 項結果
台大 : Google約有 19539 項結果
中正 : Google約有 2562 項結果
元智 : Google約有 5363 項結果

3.檔案數(Rich files)
中原 : Google約有 16,400 項結果
台大 : Google約有 429,000 項結果
中正 : Google約有 23,500 項結果
元智 : Google約有 14,100 項結果

4.Google Scholar 論文索引
中原 : Google約有 11,400 項結果
台大 : Google約有 266,000 項結果
中正 : Google約有 9,530 項結果

元智 : Google約有 2,210 項結果

訂閱：文章 (Atom)

2014年3月24日 星期一

2014年3月17日 星期一

2014年3月10日 星期一

2014年3月3日 星期一

2014年3月24日星期一

2014年3月17日星期一

2014年3月10日星期一

2014年3月3日星期一