来自 Tom Hicks 的 一个巧妙的想法,它结合了 MutationObserver
(可以“观察”元素的更改,例如属性、文本或子元素的更改)和 Web Audio API 来创建声音。 将此代码放入您想听 DOM 更改的页面控制台中,以听到它的操作。
我在 我的无服务器网站 上试用过它,因为它是一个 SPA,因此在您浏览时会产生大量的 DOM 活动。
const audioCtx = new (window.AudioContext || window.webkitAudioContext)()
const observer = new MutationObserver(function(mutationsList) {
const oscillator = audioCtx.createOscillator()
oscillator.connect(audioCtx.destination)
oscillator.type = "sine"
oscillator.frequency.setValueAtTime(
Math.log(mutationsList.length + 5) * 880,
audioCtx.currentTime,
)
oscillator.start()
oscillator.stop(audioCtx.currentTime + 0.01)
})
observer.observe(document, {
attributes: true,
childList: true,
subtree: true,
characterData: true,
})
看起来 Tom 正在尝试其他音频... 我们应该叫它们什么? 声音化? 就像这个 扫荡声。 已经有了 一个浏览器扩展,其中包括网络活动发生的音效。