Question

我正在使用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
}

Answer 1

您的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()函数的更复杂版本。

为什么JavaScript无法在Chrome扩展程序中使用？

1 个答案: