Javascript 如何从弹出式DOM读取数据

我做了一个非常简单的Chrome扩展，用户可以在文本框中输入值，按下按钮，然后将输入的值填入页面文本框（或任何其他元素）

所以，我有

popup.html：

content_script.js：

manifest.json：

---

document.getElementById（“数据详细信息”）

始终返回

null

。如何访问此元素，或如何正确写入此元素？这方面我是新手。

问题是

document.getElementById（“数据详细信息”）

在注入的脚本中，浏览器在页面中搜索id为

数据详细信息的对象，而不是
popup.html
所以

popup.js

document.addEventListener('DOMContentLoaded', function () {
    document.getElementById("btn-fill").addEventListener("click", injectTheScript);
});

function injectTheScript() {
    chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
        chrome.tabs.executeScript(tabs[0].id, { file: "content_script.js" });
        chrome.tabs.sendMessage(tabs[0].id, document.getElementById("data-details").value);
    });
}

function fillElements()
{
    chrome.runtime.onMessage.addListener(function(message) {
         document.getElementById("txt-page-input").value = message;
    });


}

fillElements();

content\u script.js

document.addEventListener('DOMContentLoaded', function () {
    document.getElementById("btn-fill").addEventListener("click", injectTheScript);
});

function injectTheScript() {
    chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
        chrome.tabs.executeScript(tabs[0].id, { file: "content_script.js" });
        chrome.tabs.sendMessage(tabs[0].id, document.getElementById("data-details").value);
    });
}

function fillElements()
{
    chrome.runtime.onMessage.addListener(function(message) {
         document.getElementById("txt-page-input").value = message;
    });


}

fillElements();

另请参阅相关内容：谢谢，它可以工作，但只有在我第二次按下弹出窗口中的“填充”按钮，代码执行两次之后…@iOrko，将chrome.tabs.sendmages移动到executeScript的回调中，请参阅文档。别忘了：大多数chrome.*API都是异步的。
document.addEventListener('DOMContentLoaded', function () {
    document.getElementById("btn-fill").addEventListener("click", injectTheScript);
});

function injectTheScript() {
    chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
        chrome.tabs.executeScript(tabs[0].id, { file: "content_script.js" });
        chrome.tabs.sendMessage(tabs[0].id, document.getElementById("data-details").value);
    });
}

function fillElements()
{
    chrome.runtime.onMessage.addListener(function(message) {
         document.getElementById("txt-page-input").value = message;
    });


}

fillElements();