有没有办法在 amp-script (javascript) 中触发鼠标悬停事件？

问题描述

AMP 文档中有一些使用 Javascript 和 Web Workers 的示例。 https://amp.dev/documentation/components/amp-script/?format=websites#script-hash

例如，我有一个在按钮点击后附加 H1 的函数：

JS：

const button = document.getElementsByClassName('hello-url')[0];

button.addEventListener('click',() => {
  const h1 = document.createElement('h1');
  h1.textContent = 'Hello World!';
  document.body.appendChild(h1);
});

AMP 虚拟 DOM：

<amp-script script="hello-world" class="sample">
  <button class="hello-url">Short button</button>
</amp-script>

当我尝试使用 mouSEOver 而不是 click 时发生错误：

[amp-script] 阻止了 2 次尝试修改 DOM 元素子元素、innerHTML 等。对于可变大小的容器，必须首先发生用户操作。

[amp-script] amp-script[script="hello-world"].js 因非法突变而终止。

请注意，我想避免使用 Jquery

解决方法

您可以在 EventListener 中使用 "mouseenter"：https://developer.mozilla.org/fr/docs/Web/API/Element/mouseover_event