当前位置: 首页 > news >正文

学习使用js和jquery修改css路径,实现html页面主题切换功能

学习使用js和jquery修改css路径,实现html页面主题切换功能

    • 效果图
    • html代码
    • js切换css关键代码
    • jquery切换css关键代码

效果图

请添加图片描述

html代码

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>修改css路径</title><link href="./css/edit1.css" type="text/css" rel="stylesheet" id="mylink">
</head>
<body>
<div><button onclick="editcss('edit1')"> 修改css1路径</button><button onclick="editcss('edit2')"> 修改css2路径</button>
</div><script src="./jquery-2.1.4.min.js"></script>
<script>function editcss(css_name) {//document.getElementById('mylink').href = "./css/" + css_name + ".css";$("#mylink").attr('href', "./css/" + css_name + ".css");}
</script></body>
</html>

js切换css关键代码

<script>function editcss(css_name) {$("#mylink").attr('href', "./css/" + css_name + ".css");}
</script>

jquery切换css关键代码

<script>function editcss(css_name) {document.getElementById('mylink').href = "./css/" + css_name + ".css";}
</script>
http://www.lryc.cn/news/377244.html

相关文章:

  • (转)请介绍一下Redis的数据淘汰策略
  • APP自动化测试-Appium常见操作之详讲
  • 写给大数据开发:谈谈数仓建模的反三范式
  • Stable diffusion 3 正式开源
  • 如何配置node.js环境
  • python tensorflow 各种神经元
  • Gone框架介绍27 - 再讲 Goner 和 依赖注入
  • 【Python/Pytorch 】-- 滑动窗口算法
  • Clickhouse集群create drop database可删除集群数据库或只删除本地数据库
  • 【docker】adoptopenjdk/openjdk8-openj9:alpine-slim了解
  • Vscode interaction window
  • 后端数据null前端统一显示成空
  • 【设计模式深度剖析】【9】【行为型】【访问者模式】| 以博物馆的导览员为例加深理解
  • Salesforce‘s 爱因斯坦机器人助手引领工业聊天机器人时代
  • Day7—zookeeper基本操作
  • 计算机组成原理---Cache的基本工作原理习题
  • springboot项目中切数据库(mysql-> pg)带来的适配问题:typeHandler
  • 从零开始的<vue2项目脚手架>搭建:vite+vue2+eslint
  • Hadoop升级失败,File system image contains an old layout version -64
  • [机器学习算法]决策树
  • springboot应用cpu飙升的原因排除
  • 反激开关电源EMI电路选型及计算
  • vue3前端对接后端的图片验证码
  • 【Unity】RPG2D龙城纷争(四)要诀、要诀数据集
  • 一种基于非线性滤波过程的旋转机械故障诊断方法(MATLAB)
  • HarmonyOS Next 系列之从手机选择图片或拍照上传功能实现(五)
  • 如果xml在mapper目录下,如何扫描到xml
  • 什么是无限铸币攻击?它是如何运作的?
  • 【Android】怎么使APP进行开机启动
  • 详细分析Element Plus的el-pagination基本知识(附Demo)