1.<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/main.js">
document.write("<h1>helloWorld"); //文檔打印
alert("警告！")； //彈出框
console.log("打印日誌"); //console 控制檯 log 日誌/名詞作動詞
</script>
</head>
<body></body>
</html>
2.JS的數據類型
JS的數據五種數據類型（三種常用，二種特殊）
數值：Number 由n位0-9任意數字組成
字符串：String 被引號引起來的字符
布爾值：Boolean 只有兩個值：True/False
Underfined: 當空間爲空時，將會出現undefined
Null： 當你想要清空某個內存時，就可以在這個內存裏放入一個null
引用數據類型：Object
null屬於對象。
<script>
var a=123; //數值
var b="123" //字符串
var c="true" //布爾值
var d //Undefined
var e="null" //null
console.log(typeof a);
console.log(typeof b);
console.log(typeof c);
console.log(typeof d);
console.log(typeof e); //輸出上面五個值的類型
</script>
<input type="text" value="0" id="Ipt" />
<script>
console.log(typeof Ipt.value);
var num=1.2e7;
alert(num); //當數值大於10^6時，可以使用科學計數法
</script>
3.聲明變量
聲明變量/開闢內存空間
聲明變量時必須定義變量名： var a;
當空間內沒有任何數據時，JS將會在裏面存放undefined
JavaScript是一門弱類型的編程語言，聲明變量時不用表明數據類型。
<script>
var a,b,num = "123";
alert(num);
</script>
4.賦值操作符
賦值：改變變量的值
賦值操作符：
= += -= *= /= %=
自增、自減
<script>
var num=1;
num += 3; //等同於num=num+3；值爲4
num -= 2； //2
num *= 4; //8
num /= 2; //4
num %= 3; //1
alert(num);
</script>
5.改變背景顏色
<button id="btn1">盒子1</button>
<button id="btn2">盒子2</button>
<button id="btn3">盒子3</button>
<div class="box" id="box1"></div>
<div class="box" id="box2"></div>
<div class="box" id="box3"></div>
<style>
.box{width:300px;
height:300px;
border:1px solid;}
</style>
<script>
btn1.onclick = function( ){box1.style.background="blue"};
btn2.onclick=function(){box2.style.background="red"};
btn3.onclick=function(){box3.style.background="green"};
</script>
6.格式化數字
parseInt( ) 字符串轉整數
parseFloat( ) 字符串轉小數
<script>
var str = true;
console.log(parseInt(str));
</script>
7.數字增減（購物車原理）
<input type="text" value="1" id="ipt">
<script>
<button onclick="ipt.value++">+</button>
<button onclick="Ipt.value--">-</button>
</script>
8.關係操作符
> 大於
< 小於
>= 大於等於
<= 小於等於
== 等於
!= 不相當
=== 全等於（會比較數據類型）
!== 不全等（會比較數據類型）
<style>
alert(1==="2"); //會輸出ture/false
</style>
9.簡易計算器
<input type="text" id="Ipt1" value="1" />
<input type="text" id="Ipt2" value="2" />
<button onclick=alert(Ipt1.value+Ipt2.value)>
//直接加法運算，會默認是兩個字符串的拼接，輸出爲12；
<button onclick=alert( parseInt(Ipt1.value)+parseInt(Ipt2.value) )></button>
//使用字符格式化，將字符串轉化爲數值。輸出值爲3
<button onclick=alert(Ipt1.value*1 + Ipt2.value*1)></button>
//由於 減乘除 不受數值或字符串類型的影響，通過*1使字符串變爲數值（黑科技）
<button onclick=alert(Ipt1.value - Ipt2.value)></button> //減法
<button onclick=alert(Ipt1.value * Ipt2.value)></button> //乘法
<button onclick=alert(Ipt1.value / Ipt2.value)></button>
//除法 減乘除不需要將字符串轉化爲數值