2

条件を確認した後、別の URL を動的に挿入したい

ここに疑似コードがあります

If div.id = "abc" then
create url <a href="www.zzz.html"'>Cosmetics</a>');
Append url to div

else if div.id = "xyz" then
create url <a href="www.abc.html"'>LEather goods</a>');
Append url to div

else if div.id = "mno" then
create url <a href="www.kkk.html"'>Diapers</a>');
Append url to div

等々。

これを JavaScript/jQuery でどのように記述できますか。このような If-Else 条件が 15 個ある場合、コードを効率的に処理する方法。

このコードは見栄えがよくありません

if $("#abc) then

 var dynLink = $('<a href=zzz.html"'>Cosmetics</a>');
    $("#abc").append(dynLink);

else if $("#xyz")
 var dynLink = $('<a href=abc.html"'>LEather</a>');
    $("#xyz").append(dynLink);

ありがとう！

4

4 に答える 4

2

これを試すことができます：

var link = [
    ["#abc", "#wfh", "http://www.123.com", "Maine"],
    ["#123", "#qwe", "http://www.abc.com", "Texas"]
];

$.each(link, function(e) {
    $(link[e][0] + "," + link[e][1])
        .append("<a href='" + link[e][2] + "'>" + link[e][3] + "</a>");
});​

例: http://jsfiddle.net/Yvuvh/5/

これは単に配列内のリンクとタイトルを設定するだけであり、ループが配列を検索して、それらのいずれかでforを見つけることができるかどうかを確認し、見つかった場合は適切なリンクを追加します。divid

さらに追加するには、次のように配列にarray別のものを追加します。link

var link = [
    ["#abc", "#wfh", "http://www.123.com", "Maine" ],
    ["#123", "#qwe", "http://www.abc.com", "Texas" ],
    ["#xyz", "#zyx", "http://www.yzx.com", "Mexico"]
];​
于 2012-05-30T02:50:28.297 に答える
1 
if $("#abc) then

 var dynLink = $('<a href=zzz.html"'>Cosmetics</a>');
    $("#abc").append(dynLink);

else if $("#xyz")
 var dynLink = $('<a href=abc.html"'>LEather</a>');
    $("#xyz").append(dynLink);

▲ それは有効な JavaScriptではありません。

▼これは、sがたくさんある場合の方法です。if-then

switch(div.id){
    case "abc":
        $('<a href="zzz.html">Cosmetics</a>').appendTo("div#whateveritis");
        break;
    case "xyx":
        $('<a href="abc.html">Leather</a>').appendTo("div#whateveritis");
        break;
    case "more more more":
        //same stuff here.
        break;
    default:
        //default
        break;
}

初心者にとって非常に自明です。;)

真剣に、MDN MDNの内容を調べ始める必要があります。JavaScript のリファレンスやデモ (例) を掲載するのに適した場所です。

于 2012-05-30T02:46:07.887 に答える
1

次のように、これらすべての関係を含むオブジェクトを作成します。

var links = {
    'abc': { link:'foo.html', text:'Foo Link' },
    'xyz': { link:'bar.html', text:'Bar Link' }
};

div次に、これをテストするためにいくつかの要素を追加します。

​&lt;div id="abc"></div>
<div id="xyz"></div>​​​​​​​​​​
<div id="foo"></div>

最後に、いくつかのリンクを追加する必要がある jQuery を次に示します。

$("div").append(function(){
    var link = links[this.id];
    return link ? $("<a>", { href:link.href, html:link.text }) : "n/a" ;
});​​​

これはすべての要素を巡回し、それらがオブジェクト内にあるdivかどうかを確認します。そうであれば、適切なプロパティを持つリンクをその中に配置します。オブジェクト内でそれが見つからない場合は、単純に「n/a」を に追加します。idlinksdividdiv

<div id="abc"><a href="foo.html">Foo Link</a></div>
<div id="xyz"><a href="bar.html">Bar Link</a></div>
<div id="foo">n/a</div>

デモ: http://jsfiddle.net/vFjSw/

于 2012-05-30T03:22:11.343 に答える
0

div.id をターゲット URL にマップする関連配列に入れ、キーで検索します。1 つのハッシュ化されたルックアップは、ルックアップごとに 1 回ロードするだけでよい場合、直線的な数のif /else-if 比較よりも優れています...

これは、マイクロパフォーマンスに関係なく、より「エレガント」または読みやすく、保守しやすいと思います。make array と run if/else if のどちらが速いかは、私には明らかではありません。プロファイリングする必要があります。ただし、1) 時間を最適化する必要があり、2) ページが読み込まれるたびにこのコードを 1 回だけ使用することを期待している場合は、期待する URL を if/elif ブロックの先頭に配置することをお勧めします。将来の開発者がアルファベット順で並べ替えないように、これを行っていることを正確にコメントしてください。

于 2012-05-30T02:36:08.080 に答える