javascript 改變網(wǎng)頁(yè)加載的CSS

更新時(shí)間：2007年12月11日 21:12:47 投稿：mdxy-dxy

javascript 改變網(wǎng)頁(yè)加載的CSS主要通過(guò)動(dòng)態(tài)響應(yīng)select觸發(fā)的選項(xiàng)變化控制link標(biāo)簽加載的css,以實(shí)現(xiàn)不依賴cookie控制的頁(yè)面css樣式動(dòng)態(tài)加載功能,需要的朋友可以參考一下

這個(gè)是沒(méi)有種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">  

我是一只小小小小小鳥(niǎo)！  

</div>

看一下效果

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

您可能感興趣的文章:

相關(guān)文章

微信小程序模擬cookie的實(shí)現(xiàn)
本篇文章主要介紹了微信小程序模擬 cookie的實(shí)現(xiàn)，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-06-06
js實(shí)現(xiàn)時(shí)間日期校驗(yàn)
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)時(shí)間日期校驗(yàn)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-05-05
淺析JS中document對(duì)象的一些重要屬性
本篇文章主要是對(duì)JS中document對(duì)象的一些重要屬性進(jìn)行了詳細(xì)的介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2014-03-03
常用原生js自定義函數(shù)總結(jié)
下面小編就為大家?guī)?lái)一篇常用原生js自定義函數(shù)總結(jié)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
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包的方法步驟
這篇文章主要介紹了微信小程序使用npm包的方法步驟，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-08-08
JS實(shí)現(xiàn)打字游戲
這篇文章主要為大家詳細(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)常在面試中問(wèn)候：你能用?JavaScript?生成一個(gè)二維數(shù)組嗎？這個(gè)問(wèn)題看似簡(jiǎn)單,實(shí)際上卻能揭示出面試者對(duì)?JavaScript?的熟練程度,天,就讓我們一起來(lái)探索這個(gè)問(wèn)題背后的答案,揭開(kāi)生成二維數(shù)組的多種秘密,需要的朋友可以參考下
2024-04-04