1

タイトルが誤解を招く場合は申し訳ありませんが、ここで説明できることを願っています..

基本的には、単純化するために.. 商品ページがあります。これを「Apple」と呼びます。

「Apple」は、「フルーツ」ページまたは「人気ブランド」ページからの 2 つの方法のいずれかで入手できます。

さて、「Apple」ページの上部に一連のナビゲーション リンクがあります..これに似ています..

ホーム - カテゴリー - 果物 - お問い合わせ

これで、「フルーツ」ページから「アップル」にたどり着いたのであれば問題ありませんが、現状では、「人気ブランド」ページからたどり着いた場合でも、同じナビゲーション リンクが表示されます。

どこに表示したいか..

ホーム - カテゴリー - 人気ブランド - お問い合わせ

だから私の質問は、

どちらの状況でも重複ページを作成せずに、元のページに応じてリンクを変更するにはどうすればよいですか。

コードは特別なものではなく、基本的なリンクのみです..

<ul>

<li> <a href="index.html">Home</a></li>

<li> <a href="categories.html">Categories</a></li>

<li> <a href="fruit.html">Fruit</a></li>

<li class="current_page_item"><a href="fruit.html">Fruit</a></li>

<li> <a href="Contact.html">Contact</a></li>

</ul>

私が自分自身を明確に説明したことを願っており、これに関する助けに感謝します.

リー

4

2 に答える 2

1

ソースに URL 自体を追加して、?source=fruitまたは場合によっては で終わるようにすることもできます?source=popular%20brandsourceこの変数を検索し、応答の 2 つのリンクのうちの 1 つを非表示にします。

これが HTML だとします。

<nav id="nav">
    <a href="#">Home</a> 
    <a href="#">Categories</a> 
    <a href="#" data-toggle>Fruit</a> 
    <a href="#" data-toggle>Popular Brand</a> 
    <a href="#">Contact</a>
</nav>

元々は、フルーツと人気ブランドの両方のリンクが含まれていました。次は、 の値を検索するのに役立つ関数ですdocument.location.search

function getParam ( p ) {
    var search = decodeURIComponent( document.location.search );
    var val, exp = new RegExp( "[?&]" + p + "=([^&]+)" );
    return ( val = search.match( exp ) ) ? val[1] : false;
}

これは名前を渡すことで機能し、対応する値または を返しますfalse。次に、 の値を取得または提供しますsource。関数がそれを見つけられない場合getParamは、単純に「果物」であると仮定します。

var source = getParam( "source" ) || "Fruit";

ここで、ナビゲーション エリア内のすべてのリンクへの参照を収集します。

var links = document.getElementById("nav").getElementsByTagName("a"), 
    count = links.length, a;

この時点で、a要素のコレクションを循環します。属性がある場合、data-toggleそのテキストがソース テキストと一致するかどうかを確認します。そうでない場合は、非表示にします。これは?source=fruit、Popular Brand リンク?source=popular%20brandを非表示にし、Fruit リンクを非表示にすることを意味します。

while ( a = links[ --count ] ) {
    if ( a.hasAttribute("data-toggle") )
        if ( (a.textContent || a.innerText).toLowerCase() !== source.toLowerCase() )
            a.parentElement.removeChild( a );
}

これは、次の URL を表示してオンラインで確認できます。

于 2013-04-09T14:13:13.473 に答える
0

スクリプト言語を使用して、URL で渡されるパラメーターに応じて、?from=fruitまたは?from=popular_brand上記の例のように、さまざまなものを表示します。

于 2013-04-09T13:07:25.197 に答える