Javascript 从Chrome扩展弹出窗口获取值
我想知道，如果我有一个chrome扩展，当你点击图标时会弹出一个窗口，而这个窗口有一个文本框来输入数据，那么javascript会是什么样子来获取文本框中的文本Javascript 从Chrome扩展弹出窗口获取值,javascript,html,google-chrome,Javascript,Html,Google Chrome,我想知道，如果我有一个chrome扩展，当你点击图标时会弹出一个窗口，而这个窗口有一个文本框来输入数据，那么javascript会是什么样子来获取文本框中的文本 更新：我知道如何从文本框中获取值，但我的问题是，如何专门访问popup.html文件的元素？我尝试访问document.getElementById ect，但这会获取实际页面内容中的元素，而不是我的自定义弹出窗口。我们可以通过以下方式为某些事件（如按钮的单击事件）绑定事件侦听器，从弹出页面的文本框中获取值： 假设manifest.js
更新：我知道如何从文本框中获取值，但我的问题是，如何专门访问popup.html文件的元素？我尝试访问document.getElementById ect，但这会获取实际页面内容中的元素，而不是我的自定义弹出窗口。我们可以通过以下方式为某些事件（如按钮的单击事件）绑定事件侦听器，从弹出页面的文本框中获取值： 假设manifest.json文件如下所示：
{
"manifest_version": 2,
"name": "Wonderful extension",
"description": "Wonderful extension - gets value from textbox",
"version": "1.0",
"browser_action": {
"default_icon": "images/icon.png",
"default_popup": "popup.html"
}
}
<!DOCTYPE html>
<html>
<head>
<title>Wonderful Extension</title>
<script src="popup.js"></script>
</head>
<body>
<div style="padding: 20px 20px 20px 20px;">
<h3>Hello,</h3>
<p>Please enter your name : </p>
<input id="name_textbox" />
<button id="ok_btn" type="button">OK</button>
</div>
</body>
</html>
{
"manifest_version": 2,
"name": "Wonderful extension",
"description": "Wonderful extension - gets value from textbox",
"version": "1.0",
"browser_action": {
"default_icon": "images/icon.png",
"default_popup": "popup.html"
}
}
<!DOCTYPE html>
<html>
<head>
<title>Wonderful Extension</title>
<script src="popup.js"></script>
</head>
<body>
<div style="padding: 20px 20px 20px 20px;">
<h3>Hello,</h3>
<p>Please enter your name : </p>
<input id="name_textbox" />
<button id="ok_btn" type="button">OK</button>
</div>
</body>
</html>
要访问弹出页面的其他元素，我们可以使用类似的方法。也可以使用chrome.storage.sync：
function handleButtonClick(){
// Use stored sync value.
chrome.storage.sync.get("textBoxValue", ({ textBoxValue }) => {
alert(textBoxValue);
});
}
document.getElementById("popupButton").addEventListener("click", async () => {
let [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
// Store sync value before the script is executed.
let textBoxValue = document.getElementById('textBox').value;
chrome.storage.sync.set({ textBoxValue });
chrome.scripting.executeScript({
target: { tabId: tab.id },
function: handleButtonClick,
});
});
听起来像是一个哲学问题……：）哈哈，也许是吧。谁知道呢。我只是想弄清楚，在我的popout.js文件中，如果文本框的id为“input”，那么访问弹出窗口中的元素的代码是什么。如果您正在寻找提示用户直接输入的最简单方法，您是否考虑过
提示