Javascript外部引用
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
</head>
<body>
<input type="text" name="" id="first">
<!-- js文件放到body的最后面-->
<script src="js/script.js"></script>
</body>
</html>
注意事项
把Javascript代码放在什么位置有时会有影响，使用请注意。
根基语法
1. 常量
常量：恒久不变的量。
- 数字常量：
1234-1010.01
与数学中的数字表示方式完全相同。 - 字符串常量：
"abcd""1234""汉字"
使用双引号包裹的一串字符，所以叫做字符串。
注意
字符串中包含双引号，必须对双引号进行转移\"
2. 变量
变量：可以变化的量。
- 声明变量
var 变量名;
- 变量赋值
变量名=变量值;
- 定义变量
var 变量名=变量值;
- 使用变量
直接使用变量名，如同使用常量。
变量名规则
- 英文数字下划线等(不要写汉字)
- 不能数字开头
- 变量名不能重复（不能使用已经定义的）
变量值是常量或者其他变量名
3.运算
3.1 算术运算
算术运算与数学中的使用方式完全一致。但运算符有些差异。在键盘中，有加号+和减号-，但是没有乘号×和除号÷，使用/代表除法，*代表乘法。此外，使用%表示取余操作。
看一下例子就知道了。
| 运算式 | 结果 |
|---|---|
1 + 1 |
2 |
31 - 41 |
-10 |
3 * 21 |
63 |
31 / 2 |
15.5 |
17 % 7 |
3 |
17 - 7 * 2 |
3 |
3.2 关系运算
关系运算与数学中的使用方式完全一致。也是运算符略有不同。
| 操作 | 运算符 |
|---|---|
| 等于 | == |
| 不等于 | != |
| 小于 | < |
| 小于等于 | <= |
| 大于 | > |
| 大于等于 | >= |
看一下例子。
| 运算式 | 结果 |
|---|---|
1 > 1 |
false |
2 < 3 |
true |
2 != 3 |
true |
3.01<=5 |
ture |
3.3 逻辑运算
算术运算和关系运算与数学中的使用方式完全一致，而逻辑运算大家可能比较陌生。下面详细介绍一下逻辑运算。
算术运算和关系运算是数字的运算，逻辑运算是布尔值的运算。
布尔值只有true和false两个值，分别代表真假。也可以代表是非、对错、开关、亮灭等完全对立的两种状态。
我们拿物理上的电路解释逻辑运算。
- 非(
!)
非就是取反，非是一个比较特别的操作符，之前的操作符是两个操作数进行操作。这个运算只有一个操作数。规则如下： -
!true等于false -
!false等于true
前面的算术运算例子加上非运算结果如下：
| 运算式 | 结果 |
|---|---|
!(1 > 1) |
true |
!(2 < 3) |
false |
!(2 != 3) |
false |
!(3.01<=5) |
false |
- 与(
&&)
与操作规则如下： -
true && true等于true -
false && true等于false -
true && false等于false -
false && false等于false
总结为一句话：有一个为false结果就是false。有些像电路中的串联。
- 或(
||)
与操作规则如下： -
true || true等于true -
false || true等于true -
true || false等于true -
false || false等于false
总结为一句话：有一个为true结果就是true。有些像电路中的并联。
逻辑运算操作数和结果只有true和false两种情况，运算符只有与(&&)或(||)非(!)三类。
最佳实践
三种运算的计算优先级从高到低依次是：算术、关系和逻辑。通常使用小括号()来更改和明确计算的优先级。
小结
| 类型 | 运算符 | 操作数类型 | 结果类型 |
|---|---|---|---|
| 算术 |
+ - * / %
|
数字 | 数字 |
| 关系 |
== != > >= < <=
|
数字、字符串 | 布尔 |
| 逻辑 |
&& ‖ !
|
布尔 | 布尔 |
数学运算、关系运算和逻辑运算是计算机三大运算方式，计算机的一切行为都是建立在这个三个运算上的。
JS特殊的加号+
- 加号两边都是纯数字的就是求和。
- 加号两边只要有一个是文字就是字符串连接。
控制流程
顺序
默认就是顺序
分支
二选一
if(条件){
代码
}
条件是布尔值,如果条件是true,执行代码，反之条件是false，不执行代码。
if(条件){
代码1
}else{
代码2
}
条件是布尔值,如果条件是true,执行代码1，反之条件是false，执行代码2
例子
var res = confirm("真的要退出吗？");
if (res) {
document.write("已退出");
} else {
document.write("未退出");
}
多选一
if(条件1){
代码1
}else if(条件2)
代码2
}else{
代码3
}
例子代码一
var count = prompt("请输入账号？");
var res = prompt("请输入密码？");
if (count == "张三" && res == "abcde") {
document.write("欢迎张三");
} else if (count == "李四" && res == "123456") {
document.write("欢迎李四");
} else {
document.write("账号密码错误");
}
例子代码二
// 判断几月份有几天？
var month = prompt("请输入月份？");
if(month == 1){
document.write(31);
}else if(month == 2){
document.write(28);
}else if(month == 3){
document.write(31);
}else if(month == 4){
document.write(30);
}else if(month == 5){
document.write(31);
}else if(month == 6){
document.write(30);
}else if(month == 7){
document.write(31);
}else if(month == 8){
document.write(31);
}else if(month == 9){
document.write(30);
}else if(month == 10){
document.write(31);
}else if(month == 11){
document.write(30);
}else if(month == 12){
document.write(31);
}else{
document.write("月份必须是1到12");
}
例子代码二
var month = prompt("请输入月份？");
if(month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12){
document.write(31);
}else if(month == 2){
document.write(28);
}else if(month == 4 || month == 6 || month == 9 || month == 11){
document.write(30);
}else{
document.write("月份必须是1到12");
}
switch-case-break-default
switch(变量){
case 常量:
代码
break;
case 常量:
代码
break;
default:
代码
}
switch(month){
case "1":
days = 31;
break;
case "2":
days = 28;
break;
case "3":
days = 31;
break;
case "4":
days = 30;
break;
case "5":
days = 31;
break;
case "6":
days = 30;
break;
case "7":
days = 31;
break;
case "8":
days = 31;
break;
case "9":
days = 30;
break;
case "10":
days = 31;
break;
case "11":
days = 30;
break;
case "12":
days = 31;
break;
default:
document.write("月份必须是1到12");
}
document.write(month+"月份有"+days+"天");
循环
while(条件){代码}
与if区别
- 没有
else - 条件为true,执行代码[再判断]，条件为
false不执行代码
var password = prompt("请属于密码？");
while(password!="abcd"){
password = prompt("密码错误,请重新属于密码？");
}
document.write("密码正确");
常量
- 数字number
- 字符串string
- 布尔 boolean(true false)
变量三要素
1.变量名
2.变量值
3.变量类型
| 变量变量 | 变量名 | 变量值 | 变量类型 |
|---|---|---|---|
var str = "1234"; |
str |
"1234" |
string |
var num = 1234; |
num |
1234 |
number |
var b = true; |
b |
true |
boolean |
怎么判断一个变量是什么类型
typeof month;
函数(function)
定义
- 基本模板
function 函数名(参数1,参数2){代码}
参数和函数名可以没有但是关键字function和大小括弧不能缺少。最简单的函数定义如下：
function(){代码}
- 返回值使用return
使用
- 基本模板
var 返回值 = 函数名(参数1,参数2);
函数可以没有返回值，也可以没有参数。但是函数调用必须使用函数名和小括弧。下面是最简单的函数。
函数名();
函数是否有参数，有几个参数，是否有返回值完全由函数定义决定的。
- 函数三要素：函数名、参数和返回值。
对象(object)
对象是多个属性和多个方法组成。
- 对象属性本质上是变量
- 对象方法本质上是函数
对象调用属性
对象名.属性名
例如：element.value
对象调用方法
对象名.方法名(参数1,参数2);
例如：document.write("abc");
事件(event)
事件一般是鼠标点击拖拽或者键盘按键，自动调用JS代码(函数)。
根基语法是最根本的语法，如同数学中的
1+1=2，英语中的abc，是程序最基础的概念。更多是知道如何写如何用。
未完待续
