src-bex/js/content-hooks.js本质上是一个标准的内容脚本，欢迎您使用它。 内容脚本能够访问基础网页的DOM，因此您能够操纵所述页面的内容。

此文件的附加好处是此功能：

export default function attachContentHooks (bridge) {
}

此功能通过Quasar BEX构建链自动调用，并注入一个在Quasar应用程序实例和BEX的后台脚本之间共享的桥。

例如，假设我们要对Quasar应用程序上按下的按钮做出反应，并在基础网页上突出显示一些文本，这可以通过如下内容脚本来完成：

// Quasar App, /src

methods: {
  myButtonClickHandler () {
    this.$q.bex.send('highlight.content.event', { someData: 'someValue '}).then(r => {
      console.log('Text has been highlighted')
    })
  }
}

/* src-bex/css/content-css.css */

.bex-highlight {
    background-color: red;
}

// src-bex/js/content-hooks.js:

export default function attachContentHooks (bridge) {
  bridge.on('highlight.content.event', event => {
    // Find a .some-class element and add our highlight CSS class.
    const el = document.querySelector('.some-class')
    if (el !== null) {
      el.classList.add('bex-highlight')
    }

    // Not required but resolve our promise.
    bridge.send(event.responseKey)
  })
}

内容脚本生活在隔离的环境中，允许内容脚本对其JavaScript环境进行更改，而不会与页面或其他内容脚本发生冲突。

隔离的环境不允许内容脚本、扩展和网页访问其他脚本或扩展创建的任何变量或函数。 这也使内容脚本能够使用不应由网页访问的功能。

这是dom-hooks使用的地方。