结合使用jQuery和Content Script和Chrome扩展程序 [英] Using jQuery with Content Script and Chrome Extension

问题描述

我正在尝试创建一个Chrome扩展程序，当用户在页面上突出显示文本时，该扩展程序会弹出一个小输入(类似于Medium在文本突出显示功能上的推文).

I'm trying to create a chrome extension that pops up a small input when a user highlights text on the page (similar to Medium's tweet on text highlight feature).

我正在进步，但是会发现使用jQuery(而不是普通的JS和XHR)要容易得多.

I'm progressing but would find it much easier to use jQuery (rather than vanilla JS and XHRs).

我在清单中看到了一些关于需要jQuery的帖子，并且我尝试了许多不同的方法，但均未成功.

I've seen a few posts about requiring jQuery in the manifest, and I've tried it many different ways without success.

我有一个清单(下面)，一个contentscript.js和dropdown.js(我想注入到页面上的文件).

I have a manifest(below), a contentscript.js and dropdown.js(the file I want to inject onto the page).

{
  "name": "na",
  "version": "1.0",
  "manifest_version": 2,
  "description": "na",
  "homepage_url": "na",
  "content_scripts": [{
      "js": ["jquery.js", "contentscript.js"],
      "matches": ["https://github.com/*"]
    }],
  "web_accessible_resources": ["jquery.js","dropdown.js"]
}

任何帮助将不胜感激！

推荐答案

假设您在主文件夹中有jquery.js，那么您编写清单的方式应该可以使用.我怀疑您在主文件夹中没有jQuery文件(也许在脚本文件夹中，在这种情况下，您应该引用文件夹位置:例如scripts/jquery.js)或名称不正确(也许是jquery.min.js).

Assuming that you have jquery.js in the main folder, then the way you have your manifest written should work. I suspect that either you do not have the jQuery file in the main folder (maybe it's in a scripts folder, in which case you should be referencing the folder location: scripts/jquery.js, for example) or that the name is incorrect (maybe it's jquery.min.js).

如果您没有下载jQuery，建议您参考 Google托管库在您的清单中(在您当前指示的位置)

If you don't have jQuery downloaded, I would recommend referencing the Google hosted library in your manifest (in the same location you currently have it indicated)

    {
  "name": "na",
  "version": "1.0",
  "manifest_version": 2,
  "description": "na",
  "homepage_url": "na",
  "content_scripts": [{
      "js": ["https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js", "contentscript.js"],
      "matches": ["https://github.com/*"]
    }],
  "web_accessible_resources": ["dropdown.js"]
}

这篇关于结合使用jQuery和Content Script和Chrome扩展程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！