JavaScript 能够改变 HTML 内容
getElementById() 是多个 JavaScript HTML 方法之一。
---------------------------------------------------------------
JavaScript 能够改变 HTML 内容
<button type="button" onclick="document.getElementById('demo').innerHTML=clickChangeEvent()">点我！</button>
JavaScript 能够改变 HTML 属性
<button onclick="document.getElementById('myImage').src='/i/eg_bulbon.gif'">开灯</button>
JavaScript 能够改变 HTML 样式 (CSS)
document.getElementById("demo").style.fontSize = "25px";
JavaScript 能够隐藏 HTML 元素
document.getElementById("demo").style.display="none";
效果：直接把这个标签展示的干没
display:none是一种样式，如果用block，又可以将其展示出来：
document.getElementById("demo").style.display="block";
---------------------------------------------------------------
<script> 标签
在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间。
<head> 或 <body> 中的 JavaScript
您能够在 HTML 文档中放置任意数量的脚本。
脚本可被放置与 HTML 页面的 <body> 或 <head> 部分中，或兼而有之。
提示：把脚本置于 <body> 元素的底部，可改善显示速度，因为脚本编译会拖慢显示。
脚本可放置与外部文件中，外部脚本很实用，如果相同的脚本被用于许多不同的网页。
如需使用外部脚本，请在 <script> 标签的 src (source) 属性中设置脚本的名称：
<script src="myScript.js"></script>
在外部文件中放置脚本有如下优势：
1、分离了 HTML 和代码
2、使 HTML 和 JavaScript 更易于阅读和维护
3、已缓存的 JavaScript 文件可加速页面加载
如需向一张页面添加多个脚本文件 - 请使用多个 script 标签：
<script src="myScript1.js"></script>
<script src="myScript2.js"></script>
可通过完整的 URL 或相对于当前网页的路径引用外部脚本：
<script src="https://www.w3school.com.cn/js/myScript1.js"></script>
---------------------------------------------------------------
JavaScript 能够以不同方式“显示”数据：
使用 window.alert() 写入警告框
使用 document.write() 写入 HTML 输出
使用 innerHTML 写入 HTML 元素
使用 console.log() 写入浏览器控制台
使用 document.write()，出于测试目的，使用 document.write() 比较方便：
<!DOCTYPE html>
<html>
<body>
<h1>我的第一张网页</h1>
<p>我的第一个段落</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>
注意：在HTML 文档完全加载后使用 document.write() 将删除所有已有的 HTML ：
<!DOCTYPE html>
<html>
<body>
<h1>我的第一张网页</h1>
<p>我的第一个段落</p>
<button onclick="document.write(5 + 6)">试一试</button>
</body>
</html>
---------------------------------------------------------------
JavaScript 语句由以下构成：值、运算符、表达式、关键词和注释。
如果有分号分隔，允许在同一行写多条语句。
JavaScript 会忽略多个空格。您可以向脚本添加空格，以增强可读性。
在运算符旁边（ = + - * / ）添加空格是个好习惯。
为了达到最佳的可读性，程序员们常常喜欢把代码行控制在 80 个字符以内。
如果 JavaScript 语句太长，对其进行折行的最佳位置是某个运算符：
document.getElementById("demo").innerHTML =
"Hello Kitty.";
---------------------------------------------------------------
JavaScript 语句常常通过某个关键词来标识需要执行的 JavaScript 动作。
下面的表格列出了一部分将在教程中学到的关键词：
debugger 停止执行 JavaScript，并调用调试函数（如果可用）。
break 终止 switch 或循环。
continue 跳出循环并在顶端开始。
do ... while 执行语句块，并在条件为真时重复代码块。
for 标记需被执行的语句块，只要条件为真。
function 声明函数。
if ... else 标记需被执行的语句块，根据某个条件。
return 退出函数。
switch 标记需被执行的语句块，根据不同的情况。
try ... catch 对语句块实现错误处理。
var 声明变量。
---------------------------------------------------------------
var x, y; // 如何声明变量，技术上，它的值是 undefined
x = 7; y = 8; // 如何赋值
z = x + y; // 如何计算值
字符串是文本，由双引号或单引号包围
<p id="demo"></p>
<script>
var carName = "porsche";
document.getElementById("demo").innerHTML = carName;
</script>
提示：在脚本的开头声明所有变量是个好习惯！
以 var 作为语句的开头，并以逗号分隔变量：
var person = "Bill Gates", carName = "porsche", price = 15000;
声明可横跨多行：
var person = "Bill Gates",
carName = "porsche",
price = 15000;
看看他们的区别
var x = "8" + 3 + 5;var y = 3 + 5 + "8";
---------------------------------------------------------------
算数运算符用于对数字执行算数运算：
+ 加法
- 减法
* 乘法
/ 除法
% 系数
++ 递加
-- 递减
运算符 例子 等同于
= 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
---------------------------------------------------------------
== 等于
=== 等值等型
!= 不相等
!== 不等值或不等型
> 大于
< 小于
>= 大于或等于
<= 小于或等于
? 三元运算符
---------------------------------------------------------------
简单来说： == 代表相同， ===代表严格相同, 为啥这么说呢，
这么理解： 当进行双等号比较时候： 先检查两个操作数数据类型，如果相同， 则进行===比较， 如果不同， 则愿意为你进行一次类型转换， 转换成相同类型后再进行比较， 而===比较时， 如果类型不同，直接就是false.
操作数1 == 操作数2， 操作数1 === 操作数2
比较过程：
双等号==：
（1）如果两个值类型相同，再进行三个等号(===)的比较
（2）如果两个值类型不同，也有可能相等，需根据以下规则进行类型转换在比较：
1）如果一个是null，一个是undefined，那么相等
2）如果一个是字符串，一个是数值，把字符串转换成数值之后再进行比较
三等号===:
（1）如果类型不同，就一定不相等
（2）如果两个都是数值，并且是同一个值，那么相等；如果其中至少一个是NaN，那么不相等。（判断一个值是否是NaN，只能使用isNaN( ) 来判断）
（3）如果两个都是字符串，每个位置的字符都一样，那么相等，否则不相等。
（4）如果两个值都是true，或是false，那么相等
（5）如果两个值都引用同一个对象或是函数，那么相等，否则不相等
（6）如果两个值都是null，或是undefined，那么相等
---------------------------------------------------------------
JavaScript 逻辑运算符
&& 逻辑与
|| 逻辑或
! 逻辑非
JavaScript 类型运算符
typeof 返回变量的类型。
instanceof 返回 true，如果对象是对象类型的实例。
---------------------------------------------------------------
幂
取幂运算符（**）将第一个操作数提升到第二个操作数的幂。
x ** y 产生的结果与 Math.pow(x,y) 相同
---------------------------------------------------------------
JavaScript 数据类型
JavaScript 变量能够保存多种数据类型：数值、字符串值、数组、对象等等：
var length = 7; // 数字
var lastName = "Gates"; // 字符串
var cars = ["Porsche", "Volvo", "BMW"]; // 数组
var x = {firstName:"Bill", lastName:"Gates"}; // 对象
---------------------------------------------------------------
JavaScript 拥有动态类型。这意味着相同变量可用作不同类型：
var x; // 现在 x 是 undefined
var x = 7; // 现在 x 是数值
var x = "Bill"; // 现在 x 是字符串值
思考：var x; x = 7; x = "Bill";
两种写法在栈内存和堆内存中有区别吗？
---------------------------------------------------------------
超大或超小的数值可以用科学计数法来写：
实例
var y = 123e5; // 12300000
var z = 123e-5; // 0.00123
---------------------------------------------------------------
JavaScript 数组用方括号书写。
数组的项目由逗号分隔。
下面的代码声明（创建）了名为 cars 的数组，包含三个项目（汽车品牌）：
var cars = ["Porsche", "Volvo", "BMW"];
数组索引基于零，这意味着第一个项目是 [0]，第二个项目是 [1]，以此类推。
---------------------------------------------------------------
JavaScript 对象用花括号来书写。
对象属性是 name:value 对，由逗号分隔：
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
typeof "" // 返回 "string"
typeof "Bill" // 返回 "string"
typeof "Bill Gates" // 返回 "string"
typeof 0 // 返回 "number"
typeof 314 // 返回 "number"
typeof 3.14 // 返回 "number"
typeof (7) // 返回 "number"
typeof (7 + 8) // 返回 "number"
任何变量均可通过设置值为 undefined 进行清空。其类型也将是 undefined。
person = undefined; // 值是 undefined，类型是 undefined
var person = null; // 值是 null，但是类型仍然是对象（object）
null === undefined // false
null == undefined // true
---------------------------------------------------------------
原始数据
typeof 运算符可返回以下原始类型之一：
string
number
boolean
undefined
复杂数据
typeof 运算符可返回以下两种类型之一：
function
object
typeof {name:'Bill', age:62} // 返回 "object"
typeof [1,2,3,4] // 返回 "object" (并非 "array"，参见下面的注释)
typeof null // 返回 "object"
typeof function myFunc(){} // 返回 "function"
typeof 运算符把数组返回为 "object"，因为在 JavaScript 中数组即对象。