zoukankan      html  css  js  c++  java
  • 动态切换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>
  • 相关阅读:
    Codeforces Round #251 (Div. 2) A
    topcoder SRM 623 DIV2 CatAndRat
    topcoder SRM 623 DIV2 CatchTheBeatEasy
    topcoder SRM 622 DIV2 FibonacciDiv2
    topcoder SRM 622 DIV2 BoxesDiv2
    Leetcode Linked List Cycle II
    leetcode Linked List Cycle
    Leetcode Search Insert Position
    关于vim插件
    Codeforces Round #248 (Div. 2) B. Kuriyama Mirai's Stones
  • 原文地址:https://www.cnblogs.com/FlyCat/p/2573749.html
Copyright © 2011-2022 走看看