• 动态切换css


    方法一:给link一个id,直接获取该DOM操作href

    <link rel="stylesheet"  id="stylelink" type="text/css"/>

    <a href="#" onclick='javascript:document.getElementById("stylelink").href = "blue.css";return false;'>1111</a>
    <a href="#" onclick='javascript:document.getElementById("stylelink").href = "red.css";return false;'>1111</a>

    方法二:

     <!DOCTYPE html>
    <html>
    <head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" >
    <title>无标题 1</title>
    <link rel="alternate stylesheet" href="red.css" type="text/css" title="red" media="screen, projection"/>
    <link rel="alternate stylesheet" href="blue.css" type="text/css" title="blue" media="screen, projection"/>
    
    <script type="text/javascript">
        function setActiveStyleSheet(title) {
            var i, a, main;
            if (title) {
                for (i = 0; (a = document.getElementsByTagName('link')[i]); i++) {
                    if (a.getAttribute('rel').indexOf('style') != -1 && a.getAttribute('title')) {
                        a.disabled = true;
                        if (a.getAttribute('title') == title) 
                         a.disabled = false;
                    }
                }
            }
        }
    </script>
    </head>
    
    <body>
    <a href="#" onclick="setActiveStyleSheet('red'); return false;" >red</a>
    <a href="#" onclick="setActiveStyleSheet('blue'); return false;" >blue</a>
    <a href="#" onclick="setActiveStyleSheet('none'); return false;">none</a>
    </body>
    </html>
  • 相关阅读:
    PKUSC2021游记
    P3349 [ZJOI2016]小星星
    序二
    1.3 解析库的安装
    1.2 请求库的安装
    1.5 存储库的安装
    1.6 Web 库的安装
    1.7 App 爬取相关库的安装
    2.1 HTTP 基本原理
    1.9 部署相关库的安装
  • 原文地址:https://www.cnblogs.com/FlyCat/p/2573749.html
Copyright © 2020-2023  润新知