如何在Chrome扩展程序中使用外部JavaScript

Question

我正在编写chrome扩展程序，并且想使用jQuery和simpleweather.js 。
扩展的目的是在新选项卡中显示具有良好背景图像的外部温度。
当我在外部使用脚本时，HTML网站可以正常工作并显示温度，但扩展名却无法正常工作。
HTML：

<head>
    <title>Nová karta</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-icons.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.simpleWeather/3.1.0/jquery.simpleWeather.min.js"></script>
    <script src="javascript.js"></script>
</head>

表现：

{
  "browser_action": {
    "default_title": "TimePage", 
    "default_popup": "popup.html" 
  },
  "description": "", 
  "chrome_url_overrides": { 
    "newtab": "timepage.html" 
  },
  "permissions": [ 
    "tabs",
    "cookies"
  ],

  "content_scripts": [
    {
      "matches": [ "<all_urls>" ],
      "js": [ "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js", "https://cdnjs.cloudflare.com/ajax/libs/jquery.simpleWeather/3.1.0/jquery.simpleWeather.min.js" ],
    }
  ],
  "manifest_version": 2, 
  "name": "Temperature", 
  "version": "1.0" 
}

当我将本地HTML脚本包含在与timepage.html所在的文件夹相同的文件夹中时，站点无法正常工作， 甚至无法显示温度 ，扩展名也无法正常工作。
HTML：

<head>
    <title>Nová karta</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-icons.css">

    <script src="weather/jquery.simpleWeather.min.js"></script>
    <script src="jquery.js"></script>
    <script src="javascript.js"></script>
</head>

表现：

{
  "browser_action": {
  "default_title": "TimePage", 
  "default_popup": "popup.html" 
  },
  "description": "", 
  "chrome_url_overrides": { 
    "newtab": "timepage.html" 
  },
  "permissions": [ 
    "tabs",
    "cookies"
  ],

  "content_scripts": [
    {
      "matches": [ "<all_urls>" ],
      "js": [ "jquery.simpleWeather.min.js", "jquery-3.1.1.min.js" ],
    }
  ],
  "manifest_version": 2, 
  "name": "Temperature", 
  "version": "1.0" 
}

Answer 1

唯一的问题是加载顺序。 您应该先调用jquery simpleWeather，然后再调用js。

Answer 2

我解决了问题。 您只需要更改脚本的顺序。 HTML：

<head>
    [...]  
    <script src="jquery-3.1.1.min.js"></script>
    <script src="jquery.simpleWeather.min.js"></script>
    <script src="javascript.js"></script>
</head>

如何在Chrome扩展程序中使用外部JavaScript

问题描述

2 个解决方案

解决方案1
0 已采纳 2016-11-13 00:56:57

解决方案2
0 2016-11-13 00:57:38

如何在Chrome扩展程序中使用外部JavaScript

问题描述

2 个解决方案

解决方案1 0 已采纳 2016-11-13 00:56:57

解决方案2 0 2016-11-13 00:57:38

解决方案1
0 已采纳 2016-11-13 00:56:57

解决方案2
0 2016-11-13 00:57:38