7、Web Audio API与HTML/CSS构建用户界面全解析

Web Audio API与HTML/CSS构建用户界面全解析

1. Web Audio API基础：节点图与振荡器

在深入探讨Web Audio API之前，我们需要先了解如何访问该API。可以通过使用 AudioContext() 方法创建的对象的属性和方法集合来访问Web Audio API。以下是创建 AudioContext 对象的代码：

const AudioContext = new AudioContext();

AudioContext() 是一个构造函数，使用 new 关键字调用时会返回一个对象，该对象包含了访问Web Audio API所需的所有方法和属性。

1.1 节点图

节点图是节点的集合。节点图中的节点可以是表示音频输入源的对象（如振荡器），也可以是用于操作音频输入源的对象（如滤波器）。这些节点通过 connect 方法连接在一起。

以下是一个将振荡器节点连接到滤波器节点的示例代码：

"use strict";
const audioContext = new AudioContext();
// 创建振荡器和滤波器
let filter = audioContext.createBiquadFilter();
let oscillator = audioContex