1.彈出框法則
在一個創建好的HTML頁面上
<body>
# 內嵌式JS
<script> alert('我是隻小白鼠') </script>
# 行內式JS交互
<input type="button" value="唐伯虎" οnclick="alert('啊 是秋香')">
# 外部引入JS文件, 在外部文件寫入JS代碼
<script src='my.js' ></script>
</body>
訪問此頁面，會有彈出框顯示
第一個是頁面彈出框
第二個是按鈕彈出框
第三個是外部文件引入彈出框
2.彈出框輸入
<body>
<script>
# 這是一個輸入框
prompt('請輸入內容');
</script>
</body>
瀏覽器彈出輸入框 這裏的 # 代表註釋，執行時請去掉 注意末尾加分號
之後添加 alert 輸出框可跟隨彈出
3.程序員調試
<body>
<script>
console.log('我是程序員看到的');
</script>
</body>
在F12開發者模式Console 可以看到內容
4.變量
var myname = 18;
使用 var 開頭賦值
var my_love = prompt('請輸入愛人名稱')
alert (my_love)
變量賦值後存儲使用
var age = 20,
name = 'li',
love = 'lala';
一次聲明多個變量
console.log(Number.MIN_VALUE) 最大值
console.log(Number.MAX_VALUE) 最小值
console.log(Number.MAX_VALUE * 2) 無窮大 Infinity
isNaN(12) 判斷是否爲非數字
此處代碼都在 script 語句中
5.字符串拼接
只要有字符串和其他類型相拼接，最終的結果是字符串類型
console.log('12'+12) ---
prompt('請輸入') 獲得輸入的數字默認是字符串型
parseInt() 字符串轉化整形，強制取整
Number() 字符串轉整形
parseFloat() 轉化浮點型
6.隱式轉換
console.log('120' - '0')
輸出爲數字 120
- * / 等運算符都會轉化爲數字
字符串加法執行拼接法則
布爾類型判斷
<script>
console.log(Boolean(''))
console.log(Boolean(0)) 結果都爲 false
console.log(Boolean(NaN))
console.log(Boolean(null))
console.log(Boolean(undefined))
</script>
布爾值以上五個爲 false
其他值只要存在都爲 true
7.小測試
<script>
var age = prompt('你的年齡是');
var sex = prompt('你的性別是');
var na = prompt('你的名字是');
alert ('你的年齡是:' + age + '\n' + '你的性別是:' + sex + '\n' + '你的名字是:' + na);
</script>
分別輸入 1 2 3
8.前置和後置遞增運算符
單獨使用時二者相同
a = a + 1 ---a++ ++a
放在運算式中
var a = 1
console.log(++a + 1) 輸出 3 先自加再運算
console.log(a++ + 1) 輸出 2 先運算後自加 運算結束後 a 是 2
注意 a++ + ++a 是 4
== 會自動將字符串轉換爲數值型
console.log(10 == '10') true
=== 返回 false 要求類型和數值均相等
邏輯與 1真2決定 1假1決定 邏輯或相反
9. if 語句
if (判斷條件) {
如果條件爲真則執行這些內容
}
if–else 基本實現
<script>
var age = prompt('你的年齡')
if (age >= 18) {
alert ('我要帶你上王者')
}
else {
alert ('你太菜')
}
</script>
二選一
if (第一個判斷條件) {
對應語句
}
else if (第二個判斷) {
對應語句
}
else if (第三個) {
對應
}
else {
對應語句
}
多分支語句，多選一
10.while循環
戀愛詢問
<script>
var message = prompt('你愛我嗎');
while (message != '我愛你') {
message = prompt('你愛我嗎');
}
var mess = prompt('你真的愛我嗎')
while (mess != '我真的愛你') {
mess = prompt('你真的愛我嗎')
}
alert ('我也愛你啊');
</script>
死循環，直到對方答應詢問結束