次のコードに相当するJavascriptが必要です。私はphpウェブサイトをdjangoウェブサイトに変換していますが、静的ページには次のものがあります。
<li<?if($page == "home") {?> class="active"<?}?>><a href="/home" title="Home">Home</a></li>
問題は、ここでphpを削除し、javascriptを使用してそのページでclass="active"を使用したいことです。
次のコードに相当するJavascriptが必要です。私はphpウェブサイトをdjangoウェブサイトに変換していますが、静的ページには次のものがあります。
<li<?if($page == "home") {?> class="active"<?}?>><a href="/home" title="Home">Home</a></li>
問題は、ここでphpを削除し、javascriptを使用してそのページでclass="active"を使用したいことです。
これにはJavaScriptは必要ありません。次のように、bodyタグにクラスを動的に追加できます。
<body class="blog">
...そして、次のように各リンクにクラスを追加します。
<a class="home" href="" >...</a>
<a class="blog" href="" >...</a>
<a class="about" href="" >...</a>
...そして、このルールをcssに追加します。
body.blog a.blog, body.home a.home, body.about a.about
{
// Do stuff that you only want applied to the "active" page link
}
基本的な考え方は、これは、ページ上の要素に「アクティブ」なスタイルを適用するだけで、bodyタグクラスとスタイルを設定する要素が正しく一致することです。
jsで現在のページを取得するには、
var currentpage = document.location.href
// this will return the full path e.g. http://www.home/home.html
var homepage = currentpage.search(/home.html/);
if (homepage >-1)...
本当にこれを行う必要がある場合は.addClass()
、jqueryhttp : //api.jquery.com/addClass/で使用できます。
同等のCSSはありません。CSSは(まだ)それほど賢くはありません。JavaScriptで何かを行うことはできますが、サーバー側の言語ですでにそれを行うことができれば、それはばかげています。
注元のタイトルは、JavaScriptではなくCSSを要求していました。それ以来、編集されています。
CSS
HTML要素をスタイリングするための言語です。
PHP
サーバーサイドスクリプト言語です。
それには大きな違いがあります。CSS
でできることはできませんPHP
。その逆も同様です。アーティストとエンジニアを想像してみてください。
JavaScript
あなたの最も近い方法です。これはクライアント側のスクリプト言語です。そして、jQueryでやりたいことをするために:
$('li').addClass('active');
しかしもちろん、あなたはあなたのコードをもっと投稿する必要があります。