Как сделать расширение Google Chrome для запуска jQuery Script - PullRequest
Новая
       2

Как сделать расширение Google Chrome для запуска jQuery Script

9 голосов
/ 17 февраля 2011

У меня есть скрипт jquery: 

$('[id^=changesetList] tr').each(function () {
    var sid = $(this).attr('sid');
    $(this).find('td span.changesetDescription').append('<span class="csetHash">' + sid + '</span>').css('color','#777');
});

Я хочу запустить это при посещении kilnhg.com.

Я вставил файл kiln_hash.user.js и установил его в Chrome, но он ничего не делает.

Я думаю, это может быть потому, что для этого требуется jQuery.

Я прочитал несколько руководств, и, похоже, мне может понадобиться создать файл manifest.json и поместить его и файл .user.js в zip-файл с расширением .crx.

Я до сих пор не знаю, что мне нужно было бы поместить в файл манифеста.

Как мне заставить это работать?

Обновление

Я создал manifest.json файл: 

{
  "name": "Kiln Hash",
  "version": "1.0.1",
  "description": "Show hash in changeset list in Kiln",
  "content_scripts": [
    {
      "matches": ["https://*.kilnhg.com/*"],
      "js": ["jquery.js"]
    }
  ],
  "background_page": "bg.html"
}

Я включаю файл jquery.js (версия 1.4.2) и файл bg.html: 

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="jquery.js"></script>

<script>

$(document).ready(function(){
    $(hash_link).click(function(){
        addHash();
        return false;
    });
});
function addHash()
{
    $('[id^=changesetList] tr').each(function () {
        var sid = $(this).attr('sid');
        $(this).find('td span.changesetDescription').append('<span class="csetHash">' + sid + '</span>').css('color','#777');
    });
}

</script>

<title>Untitled Document</title>
</head>

<body>
<a id="hash_link" href="#">Add Hash</a>
</body>
</html>

Я упаковал это в zip с расширением .crx, и когда я перетаскиваю файл в Chrome, он спрашивает меня, хочу ли я установить, я говорю да. Затем он говорит мне "плохое магическое число"

Итак, я захожу на панель инструментов разработчика Chrome и загружаю zip-файл, он принимает его, он платит 5 долларов за загрузку и затем устанавливает. но все равно ничего не делает.

1 Ответ

23 голосов
/ 17 февраля 2011

Вам может понадобиться не только манифест, манифест является абсолютно необходимой частью любого расширения. Ненавижу это говорить, но вам, вероятно, нужно сначала прочитать немного больше о структуре расширений, и на все ваши вопросы будут даны ответы.

(Я могу дать вам ответ, если хотите, но для вас было бы выгоднее прочитать эти ссылки самостоятельно, там все подробно описано и объяснено)

UPDATE

Чтобы локально установить расширение, вам не нужно его архивировать, просто перейдите к своим расширениям chrome://extensions/, нажмите «Режим разработчика», кнопку «Загрузить распакованное расширение», а затем укажите его в папке расширения.

Если вы хотите внедрить скрипт на какую-то страницу, вам нужно использовать так называемые «скрипты контента». Ваш манифест должен выглядеть так: 

{
  "name": "Kiln Hash",
  "version": "1.0.1",
  "description": "Show hash in changeset list in Kiln",
  "content_scripts": [
    {
      "matches": ["https://*.kilnhg.com/*"],
      "js": ["jquery.js", "content_script.js"]
    }
  ]
}

content_script.js: 

$('[id^=changesetList] tr').each(function () {
    var sid = $(this).attr('sid');
    $(this).find('td span.changesetDescription').append('<span class="csetHash">' + sid + '</span>').css('color','#777');
});

Этот скрипт контента будет запускаться в указанном вами домене после загрузки DOM и внедрения jquery.

Вам не нужна фоновая страница для этого.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...