在chrome扩展(不只是一个函数)上单击一个按钮后，执行所有的javascript.js

Executing all javascript in a .js after clicking a button on a chrome extension (not just one function)

本文关键字：一个 执行 js javascript 按钮 函数 扩展 chrome 单击      更新时间：2023-09-26

我是javascript的新手，有很多资源，但它们很难使用，因为我在chrome扩展上工作的约束。

Chrome扩展不允许在HTML中添加javascript代码，除非以这种形式:

<script language="javascript" src="login.js"></script>

现在，我有login.js运行和传递一些信息给API。这发生在HTML加载时，这是由用户点击chrome按钮引起的。

HTML: 

<html>
<head>
    <link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<body>
    <input id="clickMe" type="button" value="clickme"/>
    <script language="javascript" src="login.js"></script>
</body>
</html>

用户单击扩展按钮后显示此页面，并立即运行login.js脚本。

我希望它只在按钮clickme被按下后运行login.js

login.js包含:

document.write("<br />" + "From login" + "<br />");
var output;
output = FunctionOne();
document.write("<br /> the output:  " + output + "<br />");
function FunctionOne() {
  var xhr = 
...
  return xhr;
}
function FunctionTwo() {
  var cat 
...
  return cat;
}

在函数中换行:

function writeOutput() {
    document.write("<br />" + "From login" + "<br />");
    var output;
    output = FunctionOne();
    document.write("<br /> the output:  " + output + "<br />");
}

那么login.js中的所有内容都是函数定义，所以当它加载代码时什么都不会运行。要使某些事情发生，在login.js中为clickme附加一个侦听器:

document.getElementById('clickme').addEventListener('click',writeOutput);
顺便说一下，你不应该使用document.write。相反，在你的html中有一些占位符div s，并调用document.getElementById('myDiv').textContent = 'stuff' .

一个选择是使用javascript的"eval"函数。Eval允许您从字符串中运行任意代码。因此，如果您可以从login.js文档中获取文本，然后将其保存为字符串，则可以对其运行eval。

例如:

//这个示例login.js文件的内容

 console.log(2+2)

//运行代码的javascript主文件的内容

var some_text_to_eval = get_text_from_file('login.js');
eval(some_text_to_eval);  // this should console log the number 4

上面提供的方法直接回答了你的问题。如果您想使用更简单的方法，请使用jQuery库。它有一个"click"事件，允许您在点击某些内容后执行代码:https://api.jquery.com/click/

 $('#clickMe').on('click', function(){
      // do some work
      console.log('test')
 })
相关文章：