javascript 改變網(wǎng)頁加載的CSS
更新時(shí)間：2007年12月11日 21:12:47 投稿：mdxy-dxy
javascript 改變網(wǎng)頁加載的CSS主要通過動(dòng)態(tài)響應(yīng)select觸發(fā)的選項(xiàng)變化控制link標(biāo)簽加載的css,以實(shí)現(xiàn)不依賴cookie控制的頁面css樣式動(dòng)態(tài)加載功能,需要的朋友可以參考一下
這個(gè)是沒有種cookie的，記錄給自已。
復(fù)制代碼 代碼如下:
<link href="001.css" id="cssfile" rel="stylesheet" type="text/css" />
<script>
function changeStyle(name){
//alert(name);
var css = document.getElementById("cssfile");
css.href = name+".css";
}
</script>
復(fù)制代碼 代碼如下:
<select onchange="changeStyle(this.options[this.selectedIndex].value)">
<option value="001" selected="selected">默認(rèn)樣式</option>
<option value="blue">藍(lán)色經(jīng)典</option>
<option value="red">紅色夢(mèng)幻</option>
</select>
<div id="cssTest">
我是一只小小小小小鳥！
</div>
看一下效果
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
您可能感興趣的文章:
- javascript實(shí)現(xiàn)一個(gè)網(wǎng)頁加載進(jìn)度loading
- JavaScript實(shí)現(xiàn)網(wǎng)頁加載進(jìn)度條代碼超簡(jiǎn)單
- jquery插件NProgress.js制作網(wǎng)頁加載進(jìn)度條
- JavaScript實(shí)現(xiàn)當(dāng)網(wǎng)頁加載完成后執(zhí)行指定函數(shù)的方法
- Windows下使用apache模塊實(shí)現(xiàn)合并多個(gè)js、css提高網(wǎng)頁加載速度
- js 延遲加載 改變JS的位置加快網(wǎng)頁加載速度
- JS+CSS實(shí)現(xiàn)網(wǎng)頁加載中的動(dòng)畫效果
相關(guān)文章
本篇文章主要介紹了微信小程序模擬 cookie的實(shí)現(xiàn)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-06-06
js實(shí)現(xiàn)時(shí)間日期校驗(yàn)
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)時(shí)間日期校驗(yàn)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-05-05
本篇文章主要是對(duì)JS中document對(duì)象的一些重要屬性進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2014-03-03
下面小編就為大家?guī)硪黄Ｓ迷鷍s自定義函數(shù)總結(jié)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-11-11
JavaScript中數(shù)組flat方法的使用與實(shí)現(xiàn)方法
在Array的顯示原型下有一個(gè)flat方法,可以將多維數(shù)組,降維,傳的參數(shù)是多少就降多少維,下面這篇文章主要給大家介紹了關(guān)于JavaScript中數(shù)組flat方法的使用與實(shí)現(xiàn)的相關(guān)資料,需要的朋友可以參考下2022-08-08
這篇文章主要介紹了微信小程序使用npm包的方法步驟，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)打字游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-12-12
一文詳解JavaScript中的事件循環(huán)(event?loop)機(jī)制
JavaScript中的事件循環(huán)（Event?Loop）是一種重要的機(jī)制，用于管理異步代碼的執(zhí)行，它確保?JavaScript?單線程環(huán)境中的任務(wù)按照正確的順序執(zhí)行，同時(shí)允許異步操作如定時(shí)器、網(wǎng)絡(luò)請(qǐng)求和事件處理，本將給大家詳細(xì)的介紹一下JavaScript事件循環(huán)機(jī)制,感興趣的朋友可以參考下2023-12-12
微信小程序?qū)崿F(xiàn)的一鍵復(fù)制功能示例
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)的一鍵復(fù)制功能,結(jié)合實(shí)例形式分析了微信小程序wx.setClipboardData接口實(shí)現(xiàn)操作粘貼板進(jìn)行復(fù)制操作的相關(guān)使用技巧,需要的朋友可以參考下2019-04-04
JavaScript生成二維數(shù)組的多種方法小結(jié)
我經(jīng)常在面試中問候：你能用?JavaScript?生成一個(gè)二維數(shù)組嗎？這個(gè)問題看似簡(jiǎn)單,實(shí)際上卻能揭示出面試者對(duì)?JavaScript?的熟練程度,天,就讓我們一起來探索這個(gè)問題背后的答案,揭開生成二維數(shù)組的多種秘密,需要的朋友可以參考下2024-04-04