JS学习笔记

1. 字符串：

• ``是模板文字
• ``可以进行多行输出，可以使用${}打印变量
• windows + . 可以打印表情符号

2. 相等运算符：

• ===是严格相等，不做类型强制转换
• ==是松散相等，会做类型强制转换
• !=是松散不等，!==是严格不等
• cleancode规则：在进行比较操作时尽量使用严格相等

3. 严格模式（安全编码）

• 在JS文件代码第一行写'use strict'

4. 函数

• JS中函数就是一个值，不是类型
• ES6新增的函数类型：箭头函数Arrow function

const calcAge = birthYear => 2037 - birthYear;

5. 调试

• 方法一：在浏览器控制台“sources”中设置断点
• 方法二：在代码中写“debugger”自动触发断点

6. HTML & CSS快速入门

• class和id的不同之处在于，类名可以是重复的，id必须是唯一的。一般来说，用class比用id好，用form比用div好
• 用link标签来链接CSS文件到HTML文件中
• CSS中用.类名选取类

.first {
   color: green;
}

• CSS中用*选取所有元素

7. DOM（Document Object Model）

• DOM是HTML文档的结构化表示，允许JS访问、修改HTML和CSS中的元素
• DOM不是JS的一部分，DOM是Web API接口，可以与JS进行交互

8. 通过JS操作HTML中的类class

• 当需要操作页面上的样式时，推荐做法是将样式导出到一个类中

model.classList.add('hidden')
model.classList.remove('hidden')
...

• 键盘事件是全局的，不依赖任何一个元素

document.addEventListener('keydown', function(e){});
document.addEventListener('keyup', function(e){});
document.addEventListener('keypress', function(e){});
...

• 除了用document.querySelector获取元素之外，还可以用document.getElementById('xxx')，这种方式id不用加#
• JS中可以通过src设置图片：

diceEL.src = `dice-${dice}.png`