html - Chrome 扩展不加载 DataTables 脚本/CSS

Question

DataTables configuration example

我正在尝试创建一个使用 DataTables 样式(使用 Bootstrap)的 Chrome 扩展。它似乎在本地工作，但是当我将它打包为扩展时，它不再显示任何样式。

list 文件如下:

{
"manifest_version": 2,

"name": "Cookie",
"description": "",
"version": "1.0",

"browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
},

"background": {
  "scripts": ["background.js"]
  },

"permissions": [
"activeTab",
    "tabs",
"cookies",
"history",
"storage",
"https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css",
"https://code.jquery.com/jquery-1.11.3.min.js",
"https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js",
"\u003Call_urls\u003E"
]
}

我的 html 文件使用以下脚本和 css:

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css">

<!-- refers to a table named 'test' in the body -->
<script>
$(document).ready(function() {
$('#test').DataTable();
} );
</script>

内容脚本字段是否必须添加到 list 文件中？如果是这样，那具体看起来如何？

谢谢。

Answer 1

事实证明有两个主要问题:

1. 对于 Google Chrome 扩展程序，不能在 HTML 文件中运行脚本。解决方案是创建另一个 javascript 文件。
2. 脚本(jquery 和 bootstrap)和 css 必须是本地的，所以我们创建了另一个文件夹并将文件添加到其中。