jQuery在if语句中使用数组数据

时间:2013-07-22 15:00:27

标签: javascript jquery arrays if-statement

我正试图在jQuery中了解数组。我们采取以下方案。我有一系列数据,如下:

var myVariable = [
    'key1' : 'value1',
    'key2' : 'value2',
    'key3' : 'value3',
    'key4' : 'value4'
] 

这是一个元素列表:

<ul id="elem">
    <li class="key1">Item 1</li>
    <li class="key2">Item 2</li>
    <li class="key3">Item 3</li>
    <li class="key4">Item 4</li>
</ul>

如果在数组中标识类然后替换文本内容,我将如何创建if statement来运行每个元素?所以最终输出应为:< / p>

<ul id="elem">
    <li class="key1">key1</li>
    <li class="key2">key2</li>
    <li class="key3">key3</li>
    <li class="key4">key4</li>
</ul>

我尝试了以下内容,但似乎没有效果。

$('#elm li').each(function (index) {
    $(this).text(myVariable[index]);
});

我意识到JS中没有关联数组,但我真的不了解它是如何工作的。

请直接指出我。谢谢!

3 个答案:

答案 0 :(得分:3)

一种方式:

$("#elem li").text(function(i, text) {
    return this.className in myVariable
         ? myVariable[this.className] : text;
});

另一种方式:

$.each(myVariable, function(key, value) {
    $("#elem li." + key).text(value);
});

NB:在JavaScript数组中,非数字键是对象,应该用{}包围,但不能用[]包围,如普通阵列。

答案 1 :(得分:2)

试试这个......

var myVariable = {
    'key1' : 'value1',
    'key2' : 'value2',
    'key3' : 'value3',
    'key4' : 'value4'
};
$("#elem li").text(function() {
    return myVariable[this.className] == '' ? this.text(): myVariable[this.className];
});

工作小提琴here PS:我知道它与第一个答案相似,但是在发布这个之后我已经看到了它:(

答案 2 :(得分:0)

$( '#elm li').each( function() {  
    var text = myVariable[ $( this ).className ] ? myVariable[ $( this ).className ] : '';   
    $( this ).text( text );   
});