Как добавить текст ко всем значениям массива javascript

В принципе, мне нужно преобразовать строку

"23423,1616,3461743,1345"

в строку

"<img src='23423'></img><img src='1616'></img><img src='3461743'></img><img src='1345'></img>

До сих пор я пробовал:

    var PhotoArray=JSONeventobject.Events[i].FileNameArray.split(","); // Just convert this string to array

    for (i = 0; i < PhotoArray.length; i++) {
        PhotoArray[i] = "<img src='"+PhotoArray[i]+"</img>";
    }


            var Photostring = PhotoArray.toString().replace(",", "")

Но это приводит к сбою моего браузера. Это имеет смысл для меня:/

Ответ 1

Вам нужно убедиться, что вы закрыли свой тег изображения. Другая проблема, которая может вызвать проблему, заключается в том, что i - undefined. Появляется ли в вашем браузере сообщение об ошибке?

var str = "23423,1616,3461743,1345";
var PhotoArray = str.split(",");
for ( var i = 0; i < PhotoArray.length; i++ ) {
    PhotoArray[i] = "<img src=\"" + PhotoArray[i] + "\"></img>";
}
str = PhotoArray.join("");

Ответ 2

Некоторые ужасные ответы здесь. Попробуйте:

"1,2,3,4".split(",").map(function(a) { return "<foo>" + a + "</foo>"; }).join("");

Ответ 3

В HTML нет тега </img>, поэтому вам это не нужно.

В PhotoArray[i] = "<img src='"+PhotoArray[i]+"</img>"; вы не заканчиваете тег изображения, это приведет к созданию <img src='1616</img>, поэтому он дает странные результаты. Вместо этого попробуйте PhotoArray[i] = "<img src='"+PhotoArray[i]+"'>";.

Ответ 4

Если вы не хотите использовать цикл (и я не хочу использовать цикл), вы можете сделать это:

var str = "23423,1616,3461743,1345";

str = ("," + str + ",").split(',').join("'></img>,<img src='").split(",").slice(1,-1).join('');

console.log(str);

Что это такое - добавление запятой по обе стороны списка, разделение строки на массив на основе этих запятых, а затем добавление тегов img с обеих сторон с вызовом соединения, разделение снова на основе команды между открытием img тег и закрывающий тег img, который мы просто вставляем, записывая первый и последний элементы в массиве, а затем, наконец, соединяем их все вместе в одну строку.

Выход консоли:

<img src='23423'></img><imgsrc='1616'></img><img src='3461743'></img><img src='1345'></img>

Ничего похожего на уродливое однострочное решение!

Ответ 5

В дополнение к тому, что говорит @mikel -

Вы используете ту же переменную i, что и ваш индекс, в JSONeventobject.Events и как ваш индекс в PhotoArray. Не видя остальной части вашего кода, я не знаю, будет ли это проблемой, но стоит проверить.

Кроме того, вместо преобразования в массив и обратно, проще просто написать:

var Photostring = "<img src='" + JSONeventobject.Events[i].FileNameArray.replace(/,/g, "'/><img src='") + "'/>";

(т.е. замените все запятые на '/><img src=', префикс первого элемента <img src=' и добавьте последний элемент '/>).

Ответ 6

Является ли переменная 'i' объявленной как var?

Ответ 7

#1    str.split([separator[, limit]])

функция разделения разбивает строку на массив на основе разделителя мы даем. ограничение необязательно.

#2    arr.map(callback[, thisArg])

функция отображения возвращает новый массив который сформирован от результата вызов функции callback для каждого элемента в "arr". thisArg не является обязательным.

#1    str.split([separator[, limit]])

функция соединения объединяет все элементы массива в строку. ограничение необязательно.

Итак, ответ:

var photoString = "23423,1616,3461743,1345";
var photoArray = str.split(",").map(
    function(a) {
        return '<img src="' + a + '"></img>';
    }
).join("");

Источники: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/String/split https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/map https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join