Есть ли более быстрый способ добавить значки рядом с URL-адресами/ссылками на веб-странице - альтернатива использованию события загрузки?

Я пишу надстройку для Firefox, которая добавляет маленькие значки рядом со всеми URL-адресами на веб-странице.

То, как я делаю это прямо сейчас:

  1. window.addEventListener («загрузить», AddIconsToURLs, false);
  2. В функции AddIconsToURLs: Получить все элементы по имени тега «a». Для каждого элемента «a» добавить элемент «img».

Однако для некоторых веб-страниц значки появляются долго, так как для события «загрузка» требуется время.

Есть ли более быстрый способ сделать это? Вместо того, чтобы ждать загрузки всех ссылок, а затем добавлять значки рядом с каждой из них, есть ли способ добавить значок рядом со ссылкой, как только эта конкретная ссылка будет загружена?

Любая помощь приветствуется. Спасибо.


javascript firefox-addon onload
person userlite    schedule 25.11.2010    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Есть еще одно событие, которое вы можете прослушать:

document.addEventListener("DOMContentLoaded", AddIconsToURLs, false);
person cababunga    schedule 25.11.2010
comment
Я знаю, что это событие работает в IE. Это работает и для Firefox? Это быстрее, чем событие onload? Спасибо за вашу помощь. - person userlite; 26.11.2010
comment
Я попробовал это для некоторых страниц. Каким-то образом это работает почти для всех страниц, кроме поиска Google. - person userlite; 26.11.2010
comment
@userlite это, вероятно, потому, что когда вы выполняете поиск, результаты не появляются на новой странице, они загружаются на страницу, на которой вы уже находитесь. - person MatrixFrog; 27.11.2010

arrow_upward
1
arrow_downward

Что вы хотите сделать с изображениями? Что-нибудь особенное? Если это просто для внешнего вида, гораздо проще было бы загрузить таблицу стилей CSS в свой аддон и использовать :after псевдоэлемент:

a:after {
  content: url('chrome://youraddon/skin/imagefile.png');
}

Без обработки JavaScript :)

Вы можете загрузить пользовательский файл CSS с помощью:

var sss = Components.classes["@mozilla.org/content/style-sheet-service;1"]
          .getService(Components.interfaces.nsIStyleSheetService);
var ios = Components.classes["@mozilla.org/network/io-service;1"]
          .getService(Components.interfaces.nsIIOService);
var uri = ios.newURI("chrome://youraddon/skin/cssfile.css", null, null);

if(!sss.sheetRegistered(uri, sss.AGENT_SHEET)) {
    sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
}

См. также Использование службы таблиц стилей.

person Felix Kling    schedule 25.11.2010
comment
Спасибо за ответ . У меня есть функция наведения мыши для каждого значка, которая принимает соответствующий URL-адрес и выполняет некоторую дальнейшую обработку. - person userlite; 26.11.2010
comment
Текущая последовательность: ссылка при наведении курсора -> появляется значок -> при наведении значка -> взять ссылку и выполнить дальнейшую обработку. Есть ли способ добиться этого, используя комбинацию CSS и что-то еще? - person userlite; 26.11.2010
comment
@userlite: Нет, похоже, вы не можете получить доступ к содержимому, сгенерированному CSS, поскольку оно не добавляется в DOM. Жаль, вроде хороший способ :) - person Felix Kling; 26.11.2010