JavaScript檢測瀏覽器是否支持CSS變量代碼實(shí)例
更新時間：2020年04月03日 10:37:42 作者：Qionghuihe
這篇文章主要介紹了JavaScript檢測瀏覽器是否支持CSS變量代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
JavaScript可以同樣式進(jìn)行交互，你可以通過編寫程序來動態(tài)改變文檔上元素的樣式。
有三種方法可以實(shí)現(xiàn)這樣的效果：
- 控制樣式表—可以添加、刪除、修改樣式表。
- 控制樣式規(guī)則—可以添加、刪除、修改樣式規(guī)則。
- 控制DOM中的單個元素—可以不依賴樣式表來修改元素樣式。
JavaScript 檢測瀏覽器是否支持 CSS 變量：
const isSupported =
window.CSS &&
window.CSS.supports &&
window.CSS.supports('--a', 0);
if (isSupported) {
/* supported */
} else {
/* not supported */
}
JavaScript 操作 CSS 變量的寫法如下：
// 設(shè)置變量
document.body.style.setProperty('--primary', '#7F583F');
// 讀取變量
document.body.style.getPropertyValue('--primary').trim();
// '#7F583F'
// 刪除變量
document.body.style.removeProperty('--primary');
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
微信小程序tabBar組件切換與下拉刷新實(shí)現(xiàn)詳解
tabBar相對而言用的還是比較多的,但是用起來并沒有難,下面這篇文章主要給大家介紹了關(guān)于微信小程序全局配置之tabBar的相關(guān)資料,文中通過圖文以及示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-10-10
JavaScript降低代碼圈復(fù)雜度優(yōu)化技巧
當(dāng)一個項目經(jīng)過持續(xù)迭代,不斷增加功能,逐漸變成一個復(fù)雜的產(chǎn)品時,新功能的開發(fā)變得相對困難,其中一個很大的原因是代碼復(fù)雜度高,導(dǎo)致可維護(hù)性和可讀性都很差,本文將從前端JavaScript的角度出發(fā),介紹一些有效的方法和技巧來優(yōu)化前端代碼的圈復(fù)雜度2023-10-10
這篇文章主要介紹了如何封裝屬于自己的JS組件，對js組件擴(kuò)展以及封裝用法的認(rèn)識和總結(jié)，感興趣的小伙伴們可以參考一下2016-01-01
JS獲取月的最后一天與JS得到一個月份最大天數(shù)的實(shí)例代碼
本篇文章主要是對JS獲取月的最后一天與JS得到一個月份最大天數(shù)的實(shí)例代碼進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
jQuery 表單驗證插件formValidation實(shí)現(xiàn)個性化錯誤提示
這里介紹另外一個表單驗證插件formValidation，這個插件與前面兩個插件的最大區(qū)別在于它實(shí)現(xiàn)了個性化的錯誤提示信息，顯示在表單元素右上角類似于提示條2009-06-06
在左側(cè)三級菜單導(dǎo)航想必大家都見到過吧，它的實(shí)現(xiàn)過程也并不復(fù)雜，下面有個不錯的示例，感興趣的朋友可以了解下2013-09-09
node.js使用nodemailer發(fā)送郵件實(shí)例
這篇文章主要介紹了node.js使用nodemailer發(fā)送郵件的方法,例子中使用的是QQ郵箱,你也可以修改成其它的郵箱如163、gmail等,需要的朋友可以參考下2014-03-03
基于JavaScript實(shí)現(xiàn)回到頁面頂部動畫代碼
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)回到頁面頂部動畫代碼的相關(guān)資料,代碼簡單易用，非常實(shí)用，需要的朋友可以參考下2016-05-05
JavaScriptlocalStorage基本上是瀏覽器Window對象中的存儲，您可以在中存儲任何內(nèi)容localStorage，localStorage及其相關(guān)的sessionStorage是 Web Storage API的一部分，我們將在本文詳細(xì)了解這些,需要的朋友可以參考下2023-06-06
本文主要介紹了Mac下使用charles遇到的問題以及解決辦法。具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01