Вопросы о массивах/Regex

Question

var icons = $(".IT_Icon").text().trim().split(","); 

Выше, части текста элемента, между запятыми, разбиваются и сохраняются в массиве. Если бы я хотел обернуть или добавить или сделать что-либо для элемента в исходном списке, как бы я это сделал?

Например:

до:

[cat, dog, mouse, elephant, lion, bird] 

после:

<img src="cat"/>, <img src="dog"/>, <img src="mouse"/>, <img src="elephant"/>, <img src="lion"/>, <img src="bird"/> 

На второй мысли, не мог я просто регулярное выражение, которое находит 'части' из списка , что находится между запятыми и дополняет его тем, что мне нужно? Будь то обертывание или замена?

ОТВЕТ

Это то, что я закончил с:

$(".IT_badge").each(function() { 
    var badges = $(this).text().trim().split(","); 

$(this).html(""); 

    for (i = 0; badges.length > i; i++) { 
     $(this).append($("<img/>").attr("src", 'IT_Badges/' + badges[i] + '.png')); 

     if (!(badges.length === i+1)) { 
      $(this).append(", ");   
     } 
    } 


}); 

Answer 1

Мой любимый способ сделать это просто:

str = '<img src="' + ary.join('"/><img src="') + '"/>'; 

который даст вам одну строку тегов изображения. Если вы хотите сделать это в jQuery, то вроде:

(".IT_Icon").each(function(){ 
    var $this = $(this); 
    $this.html('<img src="' + $this.text() + '"/>'); 
}); 

Вы пытаетесь получить строку? изменить HTML?

Answer 2

Я бы порекомендовал вам использовать Array.prototype.map, которые вы можете легко создать, если ваш браузер не поддерживает его.

if (!Array.prototype.map) 
{ 
    Array.prototype.map = function(fun /*, thisp */) 
    { 
    "use strict"; 

    if (this === void 0 || this === null) 
     throw new TypeError(); 

    var t = Object(this); 
    var len = t.length >>> 0; 
    if (typeof fun !== "function") 
     throw new TypeError(); 

    var res = new Array(len); 
    var thisp = arguments[1]; 
    for (var i = 0; i < len; i++) 
    { 
     if (i in t) 
     res[i] = fun.call(thisp, t[i], i, t); 
    } 

    return res; 
    }; 
} 

Затем вы можете использовать его как это:

var newIcons = icons.map(function(v) { 
    return "<img src='" + v + ".png' />"; 
}); 

Answer 3

Вы можете использовать функцию jQuery.map():

var s1 = [cat, dog, mouse, elephant, lion, bird]; 
var s2 = $.map(s1, function(x) { 
    var img = new Image(); 
    img.src = x; 
    return img; 
}); 
s2; // => [<img src="cat"/>, <img src="dog"/>, ..., <img src="bird"/>]; 

Answer 4

Что-то вроде этого?

var icons = $(".IT_Icon").text().trim().split(","); 

$.each(icons, function(i, e){ 
    $("#container").append($("<img/>", { src: $.trim(e) })); 
}); 

http://jsfiddle.net/hunter/e8Vhj/