recherche

Maison  >  Questions et réponses  >  le corps du texte

javascript - Problème d'habillage de page Web JS

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

Que signifie this.className = "current" ? Est-ce le bouton correspondant à l'état vert de la page en cours ?

世界只因有你世界只因有你2723 Il y a quelques jours907

répondre à tous(4)je répondrai

  • 天蓬老师

    天蓬老师2017-07-05 10:52:04

    this.className = "current";
    Définissez la classe du <li> actuellement cliqué sur current pour atteindre l'objectif de changement dynamique du style d'étiquette

    répondre
    0
  • 巴扎黑

    巴扎黑2017-07-05 10:52:04

    .css doit être un fichier de style qui charge le style de skin spécifié par identifiant.

    link est un élément html utilisé pour charger des ressources.

    répondre
    0
  • PHP中文网

    PHP中文网2017-07-05 10:52:04

    De manière générale, le changement de skin impliquera beaucoup de CSS. Je remplace généralement le CSS externe pour faire cette fonction.
    Supposons que j'ai maintenant un fichier HTML et deux skins HTML (deux fichiers CSS, un rouge et un jaune).
    Le code simple est le suivant
    <!DOCTYPE html>
    <html>
    <head>

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

    </tête>
    <corps>

    <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>
    C'est probablement ce que l'on ressent

    répondre
    0
  • 滿天的星座

    滿天的星座2017-07-05 10:52:04

    Votre code doit être infini. La signification de ce code est probablement de modifier le skin et de charger dynamiquement les styles CSS.

    répondre
    0
  • Annulerrépondre