網頁

2015年9月30日 星期三

( 3 ) Head First HTML5 Programming 筆記 (1~5) 第三部份

1. 認識 HTML5: 歡迎來到WEB鎮
1.<!doctype html>
2. <meta charset="utf-8">
3.
<link rel="stylesheet" href="lounge.css">
4.
<script src="lounge.js"></script>
DOM:文檔對象模型(Docment Object Model )
API:應用程式接口,提供了一個對象,方法和屬性,可以用來訪問這些技術的所有功能。

先不要糾結於後面幾頁的每一個細節,我們只是希望你對JavaScript 感覺。


<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>======</title>

<style type="text/css">
===
</style>
<script>
=====
</script>
</head>
<body>

<h1>===</h1>
<img scr="===.gif">
<p>=====</p>
<p>=====<em>===</em>====</p>
<script>
=====
</script>
</body>
</html>


2. 介紹 JavaScript DOM 一點點代碼 P35
變量:

使用一個字母(可以是小寫或大寫)、下劃線字符或美元符開頭。
創建多詞變量名時使用 "camel case" 記法.
聲明變量時一定要用var

變量 賦值 表達式

1
變量先設定好。
while (判斷式){
式為真時執行程式;
}
式為假時執行程式;
(例)
var scoops = 10;while (scoops > 0) {
alert("More icecream!")

scoops = scoops - 1

}

alert("life without ice cream isn't the same")

2
for (變量設定;判別式;執行的程式){
判別式為真時執行程式;
}
式為假時執行程式;
(例)
for (scoops = 10 scoops > 0 scoops--) {alert("There's more ice cream!")
}
alert("life without ice cream isn't the same")

9/30 P47  PDF(74/606)

3
if(判別式){ 判別式為真時執行程式;} else if (判別式){ 判別式為真時執行程式;} else if (判別式){
判別式為真時執行程式;} else if (判別式){ 判別式為真時執行程式;} else if (判別式){ 判別式為真時執行程式;} else{判別式為假時執行程式;} (例) if (scoops == 3) {
alert("Ice cream is running low!");
} else if (scoops > 9) {
alert("Eat faster, the ice cream is going to melt!")

} else if (scoops == 2) {
alert("Going once!")

} else if (scoops == 1) {
alert("Going twice!")

} else if (scoops == 0) {
alert("Gone!")

} else {
alert("Still lots of ice cream left, come and get it.")


document表示瀏覽器中的整個頁面;它包含完整的DOM,所以可以讓他做任何事情,比如查找一個特定id的元素。
document.getElementById("greenplant");
這裡要求documeny查找與指定id匹配的元素,從而為我們提供一個元素。
var planet = document. getElementById("greenplanet") ;
planet.innerHTML = "Red Alert: hit by phaser fire!";10/1 P64   PDF 91/606P

如何創建數組(陣列)1.
var tempByHour = new Array()

tempByHour(0)=59.2
tempByHour(1)=60.1
tempByHour(2)=63
tempByHour(3)=65
tempByHour(4)=62
2.
var tempByHour=[59.2,60.1,63,65,62];
向數組(陣列)增如另一個元素
tempByHour[5]=61;
使用數組元素
var message = "The temperature at 5 was " + tempByHour[5];
alert(message);
了解數組大小或其他

















121346

沒有留言:

張貼留言