干杯
我目前正在开发一个chrome扩展，旨在自动化我日常工作的一部分，并改进流程的工作流程。
作为初始poc，我试图用扩展弹出窗口中文本区域的输入替换活动选项卡的整个dom。
显然，当我用一个变量覆盖主体的html时，它不起作用，然而，使用硬编码字符串它起作用。
这是密码 popup.js :

var data_from_input = 'default value'
  submitButton.addEventListener("click", async () => {
    data_from_input = document.getElementsByName('input')[0].value;

    let [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
    chrome.scripting.executeScript({
      target: { tabId: tab.id },
      function: destroyDOM,
    });
  });

  function destroyDOM() {
    document.body.innerHTML = "test"; // works
    document.body.innerHTML = data_from_input; // doesn't work. Page content is "test" no matter what's in the variable
  }

这就是为什么 popup.html 看起来像：popup.html图像

预期行为：

页面内容应替换为输入值。

实际行为：

按下按钮后，页面内容为“测试”，而不是输入值，无论输入是什么。

我尝试过的事情：

在调试中，我看到了这一点 data_from_input 从输入中提取正确的值。但是，在 destroyDOM 函数不工作，因为断点由于某种原因未被触发，即使文本更改为“test”表示此函数实际运行。
如果我删除了将内容更改为“test”的行，那么按下按钮时将不会发生任何事情。
将硬编码值设置为 data_from_input （代码中的第一行）并通过删除第3行来避免重写它也不起作用-仍然得到“test”。
为什么它只适用于硬编码字符串而不适用于变量？
你知道是什么导致了这个问题吗？