javascript 改变网页加载的CSS

 更新时间:2007年12月11日 21:12:47   投稿:mdxy-dxy  
javascript 改变网页加载的CSS主要通过动态响应select触发的选项变化控制link标签加载的css,以实现不依赖cookie控制的页面css样式动态加载功能,需要的朋友可以参考一下

这个是没有种cookie的,记录给自已。  

复制代码 代码如下:

<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> 

复制代码 代码如下:

<select onchange="changeStyle(this.options[this.selectedIndex].value)"> 
 <option value="001" selected="selected">默认样式</option> 
 <option value="blue">蓝色经典</option> 
 <option value="red">红色梦幻</option> 
</select>   
<div id="cssTest"> 
我是一只小小小小小鸟! 
</div> 

看一下效果

[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

相关文章

  • JavaScript中几种时间格式之间的简单转换

    JavaScript中几种时间格式之间的简单转换

    近期在练习或写项目时经常会遇到时间格式的转换问题,今天我就来总结一下,这篇文章主要给大家介绍了关于JavaScript中几种时间格式之间的简单转换,需要的朋友可以参考下
    2024-01-01
  • 教你用Js写一个简单的五子棋小游戏

    教你用Js写一个简单的五子棋小游戏

    听说这是一道腾讯的面试题,可能网上已经有不少答案了,晚上没事看到这道题就自己做了下,下面这篇文章主要给大家介绍了关于如何用Js写一个简单的五子棋小游戏的相关资料,需要的朋友可以参考下
    2022-07-07
  • JS模拟超市简易收银台小程序代码解析

    JS模拟超市简易收银台小程序代码解析

    本文通过实例代码给大家介绍了JS模拟超市简易收银台小程序代码,非常不错,具有参考借鉴价值,需要的的朋友参考下吧
    2017-08-08
  • Vue使用Canvas绘制圆与半圆的示例详解

    Vue使用Canvas绘制圆与半圆的示例详解

    在 Canvas 中,基本图形包括直线图形和曲线图形,在我们的工作中,经常在统计图中会看到有饼状图等这样的圆弧图形,当然绘制曲线图形那么我们要知道曲线图形的绘制往往会涉及到曲线与弧线,所以本文就给大家介绍一下Canvas绘制圆与半圆的方法
    2023-08-08
  • 微信小程序scroll-view仿拼多多横向滑动滚动条

    微信小程序scroll-view仿拼多多横向滑动滚动条

    这篇文章主要为大家详细介绍了微信小程序scroll-view仿拼多多横向滑动滚动条,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-07-07
  • JavaScript实现经典排序算法之选择排序

    JavaScript实现经典排序算法之选择排序

    这篇文章主要为大家详细介绍了JavaScript实现经典排序算法之选择排序,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • JavaScript函数中关于valueOf和toString的理解

    JavaScript函数中关于valueOf和toString的理解

    本文给大家介绍JavaScript函数中关于valueOf和toString的理解,简单的说就是需要转换为字符串时,会调用toString,需要转换为数字时需要调用valueOf。对js valueof tostring知识感兴趣的朋友一起学习吧
    2016-06-06
  • JavaScript ES6 Module模块详解

    JavaScript ES6 Module模块详解

    这篇文章主要介绍了ES6新特性之模块Module用法,简要说明了模块Module的概念、功能并结合实例形式分析了模块Module的使用方法与相关注意事项,需要的朋友可以参考下
    2021-10-10
  • JavaScript在浏览器中的执行机制

    JavaScript在浏览器中的执行机制

    既然说到了JavaScript,那么就会绕不过去执行上下文,只有理解了执行上下文才能更好的理解JavaScript本身,不过本部分不是专门讲解 JavaScript的,主要从JavaScript的执行顺序开始介绍一下JavaScript是怎样运行的
    2023-09-09
  • 谈谈我对JavaScript原型和闭包系列理解(随手笔记9)

    谈谈我对JavaScript原型和闭包系列理解(随手笔记9)

    这篇文章主要介绍了谈谈我对JavaScript原型和闭包系列理解(随手笔记9)的相关资料,需要的朋友可以参考下
    2015-12-12

最新评论