Cómo añadir texto a todos los valores de JavaScript matriz

Question

Básicamente, lo que necesito para convertir una cadena

"23423,1616,3461743,1345" 

a una cadena

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

Hasta ahora he intentado:

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(",", "") 

Pero esto hace que mi navegador se cuelgue. Tiene sentido para mí:/

Answer 1

Debe asegurarse de cerrar la etiqueta de su imagen. Otra cosa que puede causar el problema es que i no está definido. ¿Su navegador da un mensaje de error?

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(""); 

Answer 2

No hay una etiqueta </img> en HTML, por lo que no es necesario.

En PhotoArray[i] = "<img src='"+PhotoArray[i]+"</img>"; no está terminando la etiqueta de la imagen, esto producirá <img src='1616</img> por lo que da resultados extraños. Pruebe PhotoArray[i] = "<img src='"+PhotoArray[i]+"'>"; en su lugar.

Answer 3

Además de lo que dice @mikel -

Usted está utilizando la misma variable, i, como su índice en JSONeventobject.Events y como su índice en PhotoArray. Sin ver el resto de su código, no sé si eso será un problema, pero vale la pena verificarlo.

También, en lugar de convertir a una matriz y hacia atrás, parece más fácil de simplemente escribir:

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

(es decir, sustituir todas las comas con '/><img src=', prefijar el primer elemento de <img src=', y anexar la última elemento '/>).

Answer 4

es la variable 'i' declarada como var?

Answer 5

Si no desea utilizar un bucle (y yo no quería utilizar un bucle), usted puede hacer esto:

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

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

console.log(str); 

Lo que está haciendo es añadir una coma a ambos lados de la lista, dividiendo la cadena en una matriz basada en esas comas, luego agregando las etiquetas img de cada lado con la llamada de unión, dividiendo nuevamente según el comando entre abrir la etiqueta img y cerrar la etiqueta img que acabamos de poner, quemando la primera y últimos elementos en la matriz, y finalmente uniéndolos todos juntos en una sola cadena.

La salida de la consola es:

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

No hay nada como una solución de una línea feo!

Answer 6

Algunas respuestas terribles aquí. Proveedores:

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

Answer 7

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

función de división divide una cadena en una matriz basada en separador que damos.el límite es opcional.

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

función de mapa retornos nueva matriz que se forma de resultado de llamando "devolución de llamada" función para cada elemento en "Arr". thisArg es opcional.

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

función unirse une a todos los elementos de una matriz, en una cadena. el límite es opcional.

Por lo tanto, la respuesta es:

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

Fuentes: 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