一、简介
-
JavaScript对网页行为进行编程
-
JavaScript 能够改变 HTML 内容
getElementById() 是多个 JavaScript HTML 方法之一
JavaScript 同时接受双引号单引号-
- JS能改变HTML 属性
二、使用
- JavaScript代码必须位于
<script>与</script>之间
<script>
document.getElementById("demo").innerHTML = "我的第一段 JavaScript";
</script>
-
JavaScript 函数是一种 JavaScript 代码块，可以在调用时被执行。
? 例：当发生事件时调用函数，或当用户点击按钮时。 -
可以被放在
<head>或<body>中或兼而有之 -
外部脚本
外部文件：myScript.js
扩展名 .js
如需使用外部脚本，请在 <script> 标签的 src (source) 属性中设置脚本的名称：
添加多个脚本文件 - 请使用多个 script 标签
<script src="myScript.js"></script>
-
外部脚本不能包含
<script>标签5、外部引用：
? 通过完整的 URL 或相对于当前网页的路径引用外部脚本
<script src="https://www.w3school.com.cn/js/myScript1.js"></script>
三、输出
1.使用 innerHTML
访问 HTML 元素，JavaScript 可使用 document.getElementById(id) 方法。
id 属性定义 HTML 元素。innerHTML 属性定义 HTML 内容：
2.使用 document.write()
（1）用于测试的话，使用 document.write() 比较方便
例：
<!DOCTYPE html>
<html>
<body>
<h1>我的第一张网页</h1>
<p>我的第一个段落</p>
<script>document.write(5 + 6);</script>
</body>
</html>
（2）在 HTML 文档完全加载后使用 document.write() 将删除所有已有的 HTML ：
3.使用 window.alert()
? 使用警告框来显示数据：
<!DOCTYPE html>
<html>
<body>
<h1>我的第一张网页</h1>
<p>我的第一个段落</p>
<script>window.alert(5 + 6);</script>
</body>
</html>
结果：
4、使用 console.log()
在浏览器中，您可使用 console.log() 方法来显示数据。
可以通过 F12 来激活浏览器控制台，并在菜单中选择“控制台”。
四、JS语句
JavaScript 语句由以下构成：值、运算符、表达式、关键词和注释。
- 分号分隔 JavaScript 语句。
- 在每条可执行的语句之后添加分号
- 如果有分号分隔，允许在同一行写多条语句
2.JavaScript 代码块
JavaScript 语句可以用花括号（{...}）组合在代码块中。
代码块的作用是定义一同执行的语句。
3.JavaScript 关键词
JavaScript 语句常常通过某个关键词来标识需要执行的 JavaScript 动作
四、关键词
1.Let
(1)可以使用 let 关键词声明拥有块作用域的变量。
在块 {} 内声明的变量无法从块外访问
(2) 使用 let 关键字在块内重新声明变量不会重新声明块外的变量：
(3) 在循环作用域中使用let并没有重新声明循环外的变量
(4) 在函数内声明变量时，使用var和let相似，都有函数作用域
在块外声明变量时，使用var和let相似，都有全局作用域
( 5)重新声明
- 允许在程序的任何位置使用 var 重新声明 JavaScript 变量
- 在相同的作用域，或在相同的块中，通过 let 重新声明一个 var 变量是不允许
- 在相同的作用域，或在相同的块中，通过 let 重新声明一个 let 变量是不允许
实例
let x = 10; // 允许
let x = 6; // 不允许
{
let x = 10; // 允许
let x = 6; // 不允许
}
- 在相同的作用域，或在相同的块中，通过 var 重新声明一个 let 变量是不允许的
- 在不同的作用域或块中，通过 let 重新声明变量是允许的
2.const
(1)在声明时赋值
JavaScript const 变量必须在声明时赋值：
(2)不是真正的常数
关键字 const 有一定的误导性。它没有定义常量值。它定义了对值的常量引用。
因此，我们不能更改常量原始值，但我们可以更改常量对象的属性。
注：如果我们将一个原始值赋给常量，我们就不能改变原始值：
（3）常量对象可以更改
可以更改常量对象的属性：
（4）常量数组可以更改
（5）重新声明
- 在程序中的任何位置都允许重新声明 JavaScript var 变量：
- 在同一作用域或块中，不允许将已有的 var 或 let 变量重新声明或重新赋值给 const：
- 在同一作用域或块中，为已有的 const 变量重新声明声明或赋值是不允许的：
- 在另外的作用域或块中重新声明 const 是允许的：
例：
const x = 2; // 允许
{
const x = 3; // 允许
}
{
const x = 4; // 允许
}
五、运算符
（1）JavaScript 算数运算符
算数运算符用于对数字执行算数运算：
| 运算符 | 描述 |
|---|---|
| + | 加法 |
| - | 减法 |
| * | 乘法 |
| / | 除法 |
| % | 取模（余数） |
| ++ | 递加 |
| – | 递减 |
（2）JavaScript 赋值运算符
赋值运算符向 JavaScript 变量赋值。
| 运算符 | 例子 | 等同于 |
|---|---|---|
| = | x = y | x = y |
| += | x += y | x = x + y |
| -= | x -= y | x = x - y |
| *= | x *= y | x = x * y |
| /= | x /= y | x = x / y |
| %= | x %= y | x = x % y |
加法赋值运算符（+=）向变量添加一个值。
（3）JavaScript 字符串运算符
+ 运算符也可用于对字符串进行相加（concatenate，级联）。
+= 赋值运算符也可用于相加（级联）字符串：
（4）字符串和数字的相加
相加两个数字，将返回和，但对一个数字和一个字符串相加将返回一个字符串
（5）JavaScript 比较运算符
| 运算符 | 描述 |
|---|---|
| == | 等于 |
| === | 等值等型 |
| != | 不相等 |
| !== | 不等值或不等型 |
| > | 大于 |
| < | 小于 |
| >= | 大于或等于 |
| <= | 小于或等于 |
| ? | 三元运算符 |
(6)JavaScript 逻辑运算符
| 运算符 | 描述 |
|---|---|
| && | 逻辑与 |
| || | 逻辑或 |
| ! | 逻辑非 |
(7)JavaScript 类型运算符
| 运算符 | 描述 |
|---|---|
| typeof | 返回变量的类型。 |
| instanceof | 返回 true，如果对象是对象类型的实例。 |