javascript - Firefox 扩展如何调用函数/存储任何变量
问题描述
如何在 Firefox 扩展中调用我的 js 脚本的函数
{
"manifest_version": 2,
"name": "Emailv",
"version": "1.0",
"description": "check email is vaild and update in database",
"icons": {
"48": "icons/email.png",
"96": "icons/email.png"
},
"content_scripts": [
{
"matches": ["*://*.verifyemailaddress.org/*"],
"js": ["Emailv.js"]
}
]
}
Emaily.js 有一个函数,但 Firefox 没有函数和变量
var t = "free";
function keye(){
var x = document.getElementById("nuuu").value;
var iop = 109;
x = x+1;
//sessionStorage.setItem('key', x);
var emai = document.querySelector("body > header > form > fieldset >input").value;
}
console.log("start Now");
function fire(){
document.body.style.border = "5px solid red";
console.log("start Now");
document.body.onload = addElement;
var start = document.querySelector("body > header ");
start.innerHTML +='<div id="emailv" style="position:relative;margin:auto;width:100px;height:100px;opacity:0.3;z-index:100; background:#000;"><form><input id="nuuu" type="number"><button id="st" onclick="keye()" > Start</button></form><script></div>';
}
window.onload = fire();
我现在只在控制台中收到 start ,每当我尝试获取 var t 或尝试运行它时都会出现错误 Uncaught ReferenceError: keye is not defined 并且 t no defined 因为它说 start now 这意味着 java 脚本运行但不保存任何存储对于 var 或函数
我添加元素并添加内部 HTML 并设置 onclick 函数,然后我运行此函数。
解决方案
“content_scripts”默认run_at
是"document_idle"
这意味着文档及其所有资源已完成加载。
window.onload
不会为您的脚本触发,因为脚本是在window
'load'
. 无论如何都不需要它。
这是一个例子......
console.log('Starting the code');
const t = "free";
// run fire();
fire();
function fire(){
console.log('fire called');
document.body.style.border = "5px solid red";
document.body.onload = addElement;
const start = document.querySelector("body > header ");
start.innerHTML += '<div id="emailv" style="position:relative;margin:auto;width:100px;height:100px;opacity:0.3;z-index:100; background:#000;"><form><input id="nuuu" type="number"><button id="st"> Start</button></form><script></div>';
}
function keye() {
let x = document.getElementById("nuuu").value;
const iop = 109;
x = x+1;
//sessionStorage.setItem('key', x);
const emai = document.querySelector("body > header > form > fieldset > input").value;
}
评论更新
请注意,出于安全考虑,页面 JavaScript 与内容 JavaScript 是隔离的。它们在不同的上下文/范围内运行。
当你创建一个 DOM<button id="st" onclick="keye()"> Start</button>
并将其注入到页面 DOM 中时,onclick="keye()"
将属于页面 JavaScript。显然,页面 JavaScript 无法访问function keye()
内容范围内的内容。
如果要在内容范围内运行函数,则需要添加onclick
内容范围。
例如:
document.querySelector('#st').addEventListener('click', keye);
现在'click'
将keye()
在内容范围内运行。
推荐阅读
- python - 根据另一个数据帧的值替换数据帧的 NaN
- reactjs - React Native(EXPO)中通用链接中的哈希标记
- ios - UILabel 上的 Swift 动态宽度被破坏
- c# - 无法设置共享 Excel 加载项组图像
- c# - C# | 枚举排序的编译时间检查
- angular - Chart.js 和 Angular 的渐变效果
- android - Android如何让这种“波浪”像自定义设计的布局背景?
- javascript - 我的 smtp 密码包含特殊字符给出错误
- image - 图像宽高对迁移学习模型精度的影响
- android - 特定用户的 Firebase 数据库集合