有沒有一種更快的方法來在網頁的URL /鏈接旁邊添加圖標-替代使用“ onload”事件？

Question

我正在寫一個Firefox附加組件，它在網頁中的所有URL旁邊添加了一些小圖標。

我現在做的方式是：

1. window.addEventListener（“ load”，AddIconsToURLs，false）;
2. 在AddIconsToURLs函數中：通過標記名稱“ a”獲取所有元素對於每個“ a”元素，請附加一個“ img”元素。

但是，對於某些網頁，由於“ onload”事件需要花費時間，因此圖標需要花費很多時間才能顯示。

有沒有更快的方法可以做到這一點？ 除了等待所有鏈接加載然后在每個鏈接旁邊添加圖標外，是否有任何方法在加載特定鏈接后立即在鏈接旁邊添加圖標？

任何幫助表示贊賞。 謝謝。

Answer 1

您要如何處理圖像？ 有什么特別的嗎？ 如果僅是外觀，將更容易在您的插件中加載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);
}

另請參閱使用樣式表服務 。

Answer 2

您可以聽另一個事件：

document.addEventListener("DOMContentLoaded", AddIconsToURLs, false);