为什么JavaScript不能在Chrome扩展中工作

Why is JavaScript not working in Chrome extension?

本文关键字:扩展 工作 Chrome JavaScript 不能 为什么      更新时间:2023-09-26

我正在使用HTML和JavaScript编写最简单的Chrome扩展,但显然JavaScript不起作用,我不知道为什么。这是我的HTML代码:

<script>
    function myFunction()
    {
    alert("I am an alert box!");
    }
  </script>
  <input type="button" onclick="myFunction()" value="Show alert box">

这是我的manifest.json文件代码:

{
  "name": "Blank new tab page",
  "version": "0.2",
  "incognito": "split",
  "chrome_url_overrides": {
    "newtab": "blank.html"
  },
  "manifest_version": 2
}

您的HTML DOCTYPE是过渡性的吗?如果没有,也许你的代码应该看起来更像:

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<body>
  <input type='button' value='Show alert box' onclick='myFunction()' />
  <script type='text/javascript'>
    function myFunction(){
      alert('I am an alert box!');
    }
  </script>
</body>
</html>

当然,我重新安排了。不过你的代码应该可以工作。我个人建议您的代码看起来更像:

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<body>
  <input type='button' value='Show alert box' id='btn' />
  <script type='text/javascript' src='external.js'></script>
  <script type='text/javascript'>
    showAlert('btn');
  </script>
</body>
</html>

external.js将被缓存。它可以看起来像:

function E(e){
  return document.getElementById(e);
}
function showAlert(e){
  E(e).onclick = function(){
    alert('I am an alert box!');
  }
}

后一段代码更具可重用性,它将让您了解jQuery的$()。这是我的E()函数的一个更复杂的版本。