在Chrome中獲取僞元素內容

我在webkit瀏覽器中通過Javascript獲取僞元素的生成內容時遇到了一些麻煩。在Chrome中獲取僞元素內容

對於那些關心的人來說：我正在研究一個jQuery移動應用程序並試圖使用FontAwesome圖標。我希望能夠添加它們與jQM使用它自己的內置圖標集相同的數據圖標屬性。所以我有一個腳本，在頁面上搜索類ui-icon-whatever的任何內容，併爲FontAwesome添加相應的icon-whatever類。問題在於FontAwesome爲其圖標使用僞內容，而jQM使用良好的老式背景圖像精靈。因此，如果圖標名稱中出現任何重疊（例如，這兩個圖標都有一個名稱爲「edit」的圖標），則最終會有一個圖標疊加在另一個圖標上。正如你可能想象的那樣......看起來不太好。所以我試圖通過設置內容屬性從任何.ui-icon中刪除背景圖像。基本上，如果存在具有該名稱的FontAwesome圖標，請刪除jQM圖標。

當我瞭解getComputedStyle時，我很興奮，但我試過window.getComputedStyle(this,':before').content != ''和幾個變化無濟於事。試着用':: before'和'before'作爲第二個屬性，嘗試將它與null或false比較，而不是空字符串，但結果是相同的：它可以找到所有的圖標，或者找不到它們。

當我在Chrome控制檯中轉儲出window.getComputedStyle(this,':before').content時，即使在應該有內容的情況下，我也總是會看到空字符串。 Firefox正確。 ~~我不確定這是Chrome的事情還是Webkit的事情。~~

我在做什麼錯？

編輯：已下載Safari 5 for Windows。一樣的。內容始終是一個空字符串。我開始認爲它可能與我用來獲取this的jQuery選擇器有關。

來源

2013-10-28 Yumecosmos

有Safari瀏覽器的Windows太 –

感謝胡安·門德斯...我的印象是，蘋果下正在放棄對它的所有支持。但它看起來仍然有可以下載的地方，所以值得一試！ – Yumecosmos

這個問題是很老，但如果有人正在尋找一個解決方案，這是你怎麼做：

window.getComputedStyle(document.querySelector('#element'),':after').getPropertyValue('content')

來源

2014-03-05 21:26:43 PerMafrost

在Chrome中獲取僞元素內容

回答

相關問題