如何在頁面渲染過程中更改顏色SVG？

Question

首先我知道如何動態改變SVG的顏色。我已經使用該解決方案從這樣一個問題：

jQuery SVG image replacement

但我的情況是不同的。

在我的頁面上，我有幾個圖標（SVG），並有一個顏色選擇器。用戶可以使用colorpicker更改圖標。 所有工作正常。

現在我想用用戶選擇的圖標的顏色生成整個頁面的PDF。

我正在使用第三方PDF生成庫，它接受我的頁面URL並生成該頁面的PDF。但問題是，顏色不適用於圖標和PDF生成。我知道這個問題的原因，因爲在文檔準備就緒後，我將所有SVG img標籤轉換爲實際的SVG標籤，然後將顏色應用於用戶選擇的顏色。這一切都發生在頁面渲染後。

但是PDF生成庫不會等待此過程完成並在所有SVG圖像轉換爲SVG並將顏色應用於它們之前生成PDF。

我不知道要先等待整個過程才能完成並生成PDF。

我嘗試過緩存頁面，但這也沒有幫助。

任何幫助將不勝感激。 謝謝

Answer 1

我做到了。

解決方案是將代碼封裝在IIFE中，以便在頁面加載時立即執行，而不是在DOM的就緒事件上執行。