模块
参见 ES6 部分
DOM
参见 Web 相关部分
选择器
-
document.querySelector()来获取网页的对应 HTML 元素 -
document.querySelectorAll()来获取网页的所有对应 HTML 元素 -
document.getElementById()根据 ID 获取元素 -
document.getElementsByClassName()根据类名获取元素 -
document.getElementsByTagName()根据 HTML 元素名获取元素
document.querySelector('p');
事件处理
监听事件的函数叫“事件监听器（event listener）”；处理事件的函数叫“事件处理器（event handler）”。
常用的监听器：addEventListener(),第一个参数是事件的类型，第二个参数是事件处理器。
const target = document.querySelector('body');
function handleClick() {
console.log('clicked the body');
}
target.addEventListener('click', handleClick);
也可以给 HTML 元素添加点击属性：
<h1 onClick='handleClick2()'></h1>
function handleClick2() {
console.log('clicked the heading');
}
内容更新
可以使用 prompt() 内置方法获取用户输入。注：这不是最佳实践，应该使用表单。
let answer = prompt('What is your name?');
if (typeof(answer) === 'string') {
var h1 = document.createElement('h1')
h1.innerText = answer;
document.body.innerText = '';
document.body.appendChild(h1);
}
var h1 = document.createElement('h1')
h1.innerText = "Type into the input to make this text change"
var input = document.createElement('input')
input.setAttribute('type', 'text')
document.body.innerText = '';
document.body.appendChild(h1);
document.body.appendChild(input);
input.addEventListener('change', function() {
h1.innerText = input.value
})
数据格式
XML
XML（Extensive Markup Language）扩展标记语言是早期常用的数据传输文件格式。
XML 需要很多字符来描述传输的数据，并且是一门独立语言，不容易和 JS 互操作。
JSON
2001 年，Douglas Crockford 发明了 JavaScript Object Notation / JSON。
JSON 的优势：
- 轻量级，语法类似 JS 的对象
- 容易用 JS 操作
除了作为数据传输格式外，JSON 还是一种文件格式，通常从第三方网站的 json 文件获取第三方数据。
规则
JSON 是一种格式化的字符串，以下规则是 JSON 数据或者从 JSON 中提取至 JS 对象中要遵守的：
- 基本类型：字符串，数组，布尔，null
- 字符串必须用双引号："fruits"
- 数字用常规 JS 语法表示：5，10，1.2
- 布尔值用常规 JS 语法表示：
true,false - null 必须是
null
- 复杂类型：对象，数组（没有函数！）
- 对象中所有键包含双引号
- 在 JSON 对象中和 JSON 数组中，值是逗号分割的
- 不能使用 JS 注释
如果尝试字符串化不受 JSON 支持的数据，例如函数，操作会“无声地”失败。
如果尝试字符串化其他数据类型，例如 BigInt：123n，会得到如下错误：Uncaught TypeError: Do not know how to serialize a BigInt.
一些合法的 JSON 实例：
'{ "color":"red", "nestedObject": { "color": "blue" } }'
'["one", "two", "three"]'
'[{ "color": "blue" }, {"color: "red"}]'
JSON -> Object
使用 parse() 从 JSON 提取至 JS 对象：
const jsonStr = '{"greeting": "hello"}'
JSON.parse(jsonStr); // {greeting: "hello"}
使用 JSON.stringify() 把对象转化为 JSON：
const data = {
firstName: "John",
lastName: "Doe",
greeting: "Hello"
}
JSON.stringify(data) // '{"firstName": "John", "lastName": "Doe", "greeting": "Hello"}'
