JavaScript獲取偽元素(Pseudo-Element)屬性的方法技巧
CSS偽元素(pseudo-elements)非常的有用——你可以用它制作出CSS三角形,用在提示框上面,還可以用它完成很多簡單的任務(wù),而不需要多余的HTML元素。以前,偽元素的CSS屬性是無法用JavaScript獲取的,但現(xiàn)在,有了一個(gè)新的JavaScript方法可以訪問它們! 假設(shè)你的CSS代碼是這樣的:
.element:before {
content: 'NEW';
color: rgb(255, 0, 0);
}
為了獲取.element:before里的樣式屬性,你可以使用下面的JavaScript代碼:
var color = window.getComputedStyle(
document.querySelector('.element'), ':before'
).getPropertyValue('color')
將偽元素作為window.getComputedStyle方法的第二個(gè)參數(shù),你能獲取到偽元素樣式里的屬性!將這個(gè)技巧放入你的知識庫里,隨著瀏覽器的發(fā)展,偽元素將會變得越來越有用!
相關(guān)文章
countUp.js實(shí)現(xiàn)數(shù)字動(dòng)態(tài)變化效果
這篇文章主要為大家詳細(xì)介紹了countUp.js實(shí)現(xiàn)數(shù)字動(dòng)態(tài)變化效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-10-10教你JS中的運(yùn)算符乘方、開方及變量格式轉(zhuǎn)換
本文運(yùn)用實(shí)例教大家JS中的運(yùn)算符乘方、開方及變量格式轉(zhuǎn)換,代碼簡單明了,有需要的可以參考學(xué)習(xí)。2016-08-08JavaScript中number轉(zhuǎn)換成string介紹
這篇文章主要介紹了JavaScript中number轉(zhuǎn)換成string介紹,本文講解了4個(gè)把number轉(zhuǎn)換成string的函數(shù),需要的朋友可以參考下2014-12-12es6中的解構(gòu)賦值、擴(kuò)展運(yùn)算符和rest參數(shù)使用詳解
這篇文章分別給大家介紹了關(guān)于es6中解構(gòu)賦值、擴(kuò)展運(yùn)算符和rest參數(shù)使用的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-09-09H5喚醒APP實(shí)現(xiàn)方法及注意點(diǎn)總結(jié)
目前通過H5頁面喚起App的場景十分常見,比如常見的分享功能,這篇文章主要給大家介紹了關(guān)于H5喚醒APP實(shí)現(xiàn)方法及注意點(diǎn)的相關(guān)資料,需要的朋友可以參考下2021-06-06canvas?2d?環(huán)形統(tǒng)計(jì)圖手寫實(shí)現(xiàn)示例
這篇文章主要為大家介紹了canvas?2d?環(huán)形統(tǒng)計(jì)圖手寫實(shí)現(xiàn)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-04-04javaScript(JS)替換節(jié)點(diǎn)實(shí)現(xiàn)思路介紹
獲取要替換的節(jié)點(diǎn),這種方法只適用于IE瀏覽器以及適用于各種瀏覽器的寫法,感興趣的朋友可以參考下哈2013-04-04小程序怎樣讓wx.navigateBack更好用的方法實(shí)現(xiàn)
這篇文章主要介紹了小程序怎樣讓wx.navigateBack更好用的方法實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11JavaScript實(shí)現(xiàn)N皇后問題算法謎題解答
這篇文章主要介紹了JavaScript實(shí)現(xiàn)N皇后問題算法謎題解答,N皇后問題是指將N個(gè)皇后放置在NxN的國際象棋棋盤上,其中沒有任何兩個(gè)皇后處于同一行、同一列或同一對角線上,以使得它們不能互相攻擊,需要的朋友可以參考下2014-12-12JS獲取當(dāng)前時(shí)間的年月日時(shí)分秒及時(shí)間的格式化的方法
這篇文章主要介紹了js獲取當(dāng)前時(shí)間的年月日時(shí)分秒及時(shí)間的格式化,本文通過實(shí)例代碼講解的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-12-12