javascript - Masalah kulit halaman web JS
世界只因有你
世界只因有你 2017-07-05 10:50:04
0
4
875

<pautan href="green.css" rel="stylesheet" type="text/css" />

window.onload = function ()
{
    var oLink = document.getElementsByTagName("link")[0];
    var oSkin = document.getElementById("skin").getElementsByTagName("li");
    
    for(var i = 0; i< oSkin.length; i++)
    {        
        oSkin[i].onclick = function ()
        {
            for(var p in oSkin) oSkin[p].className = "";
            this.className = "current";
            oLink['href'] = this.id + ".css";                
        }    
    }
    
};
<body>
<p id="outer">
    <ul id="skin">
        <li id="red" title="红色">红</li><li id="green" class="current" title="绿色">绿</li><li id="black" title="黑色">黑</li>
    </ul>
    <ul id="nav">
        <li><a href="javascript:;">新闻</a></li>
        <li><a href="javascript:;">娱乐</a></li>
        <li><a href="javascript:;">体育</a></li>
        <li><a href="javascript:;">电影</a></li>
        <li><a href="javascript:;">音乐</a></li>
        <li class="last"><a href="javascript:;">旅游</a></li>
    </ul>
</p>
</body>

Apakah maksud ini.className = "semasa"? Adakah butang itu sepadan dengan keadaan hijau halaman semasa?

世界只因有你
世界只因有你

membalas semua(4)
Peter_Zhu

this.className = "semasa"
Tetapkan kelas <li> yang sedang diklik kepada semasa untuk mencapai tujuan menukar gaya label secara dinamik

巴扎黑

.css hendaklah fail gaya yang memuatkan gaya kulit yang ditentukan mengikut id.

pautan ialah elemen html yang digunakan untuk memuatkan sumber.

Ty80

Secara umumnya, perubahan kulit akan melibatkan banyak CSS. Saya biasanya menggantikan CSS luaran untuk melakukan fungsi ini.
Andaikan saya kini mempunyai fail HTML dan dua kulit HTML (dua fail CSS, satu merah dan satu kuning).
Kod mudah adalah seperti berikut
<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8">
<title>test</title>
<link id="css" rel="stylesheet" href="red.css">

</kepala>
<badan>

<button id="red">red</button>
<button id="yellow">yellow</button>
<script>
    var css = document.getElementById("css");
    var red = document.getElementById("red");
    var yellow = document.getElementById("yellow");
    red.onclick = function () {
        css.href = "red.css";
    };
    yellow.onclick = function () {
        css.href = "yellow.css";
    };
</script>

</body>
</html>
Begitulah rasanya

滿天的星座

Kod anda sepatutnya tidak berkesudahan Maksud kod ini mungkin untuk mengubah suai kulit dan memuatkan gaya css secara dinamik.

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan