Javascript ¿Eliminar espacios en blanco cuando no debería?

Tengo un archivo HTML que tiene un código similar al siguiente.Javascript ¿Eliminar espacios en blanco cuando no debería?

<table> 
    <tr> 
    <td id="MyCell">Hello World</td> 
    </tr> 
</table>

estoy usando javascript como el siguiente para obtener el valor

document.getElementById(cell2.Element.id).innerText

Esto devuelve el texto "Hello World" con sólo 1 espacio entre hola y el mundo. DEBO mantener el mismo número de espacios, ¿hay alguna forma de hacerlo?

He intentado usar innerHTML, outerHTML y elementos similares, pero no estoy teniendo suerte.

Fuente

2008-10-17 Mitchel Sellers

HTML es insensible al espacio en blanco, lo que significa que su DOM también lo es. ¿Cerraría su "Hello World" en pre?

Fuente

2008-10-17 21:05:31 Nick

La situación real es el uso de una cuadrícula de datos, y bueno, no creo que pueda hacerlo. Pero usted es 100% correcto en las reglas DOM. Solo esperaba una especie de truco ... –

En HTML, los espacios> 1 se ignoran, tanto al mostrar texto como al recuperarlo a través del DOM. La única manera garantizada de mantener espacios es utilizar un espacio sin interrupciones  .

Fuente

2008-10-17 21:07:08 tj111

También es una buena solución ... – Nick

Acaba de comprobarlo y parece que el ajuste con la etiqueta pre debería hacerlo.

Fuente

2008-10-17 21:07:44 Nick

Sólo un consejo, innerText sólo funciona en Internet Explorer, mientras que innerHtml funciona en todos los navegadores ... así, utilizar innerHTML en lugar de innerText

Fuente

2008-10-17 21:09:46

¡Gracias por la sugerencia! Estamos en IE6 aquí y lo haremos por un tiempo, pero eso es bueno saberlo. A pesar de todo, tengo que volver a escribir el código, ¡esto fue suficiente para justificarle a MGMT que el código no era seguro! Odio el código heredado ... –

Esto ya no es el caso - Sugiero verificar que existe y usar el que hace – slifty

La etiqueta pre o white-space: pre en su CSS va a tratar todos los espacios tan significativos. Sin embargo, esto también convertirá las nuevas líneas en saltos de línea, así que ten cuidado.

Fuente

2008-10-17 21:40:58 savetheclocktower

Lástima que las costuras IE 7 rompan esto ... – Rontologist

Editar: Estoy equivocado, ignórame.

Puede obtener un nodeValue de un nodo de texto, que debe representar correctamente su espacio en blanco.

Aquí es una función recursiva para obtener el texto dentro de un elemento dado (y su biblioteca de fallos, no fallará si se utiliza algo que modifica Array.prototype o lo que sea):

var textValue = function(element) { 
    if(!element.hasOwnProperty('childNodes')) { 
     return ''; 
    } 
    var childNodes = element.childNodes, text = '', childNode; 
    for(var i in childNodes) { 
     if(childNodes.hasOwnProperty(i)) { 
      childNode = childNodes[i]; 
      if(childNode.nodeType == 3) { 
       text += childNode.nodeValue; 
      } else { 
       text += textValue(childNode); 
      } 
     } 
    } 
    return text; 
};

Fuente

2008-10-17 21:42:32 eyelidlessness

Pensé esto también cuando iba a escribir mi respuesta. Todavía eliminó el espacio en IE 7. – Rontologist

nodeValue sigue siendo una opción mejor que innerHTML, ya que cuenta Leo

Sólo una opinión aquí y no consejo canónico, pero te diriges a un mundo o daño si tratas de extraer valores de texto exactos del DOM usando las propiedades HTML/TEXTO internas/externas a través de Javascript. Los diferentes navegadores van a devolver valores ligeramente diferentes, en función de cómo el navegador "ve" el documento interno.

Si es posible, me gustaría cambiar el código HTML que está haciendo para incluir un campo oculto, algo así como

<table> 
    <tr> 
    <td id="MyCell">Hello World<input id="MyCell_VALUE" type="hidden" value="Hello World" /></td> 
    </tr> 
</table>

Y luego apoderarse de su valor en javascript algo así como

document.getElementById(cell2.Element.id+'_VALUE').value

El las etiquetas de entrada se diseñaron para contener valores, y es menos probable que se encuentre con problemas de fidelidad.

Además, parece que está utilizando un control .NET de algún tipo. Puede valer la pena revisar la documentación (ha) o hacer una pregunta ligeramente diferente para ver si el control ofrece una API oficial del lado del cliente de algún tipo.

Fuente

2008-10-18 18:45:45

Oh, sé lo malo que es esto, solo estaba tratando de ver si hay una forma rápida de hackear para evitarlo. El control es un control antiguo de ASP.NET 1.1 que el desarrollador ni siquiera soporta. Todo el código heredado que heredé es una mierda ... Voy a volver a escribirlo de la manera correcta ... –

Esto es un poco hacky, pero funciona en mi IE.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 
<head> 
    <title></title> 
</head> 
<body> 
<div id="a">a b</div> 
<script> 
var a = document.getElementById("a"); 
a.style.whiteSpace = "pre" 
window.onload = function() { 
    alert(a.firstChild.nodeValue.length) // should show 4 
} 
</script> 
</body> 
</html>

Algunas notas:

Debe tener un tipo de documento.
No se puede consultar el elemento DOM antes window.onload ha disparado
que puedes usar en lugar de element.nodeValue innerHtml et al evitar errores cuando el texto contiene cosas como <> & "
no puede restablecer una vez whiteSpace IE termina haciendo que la página debido a lo que supongo que es un feo error

Fuente

2008-10-18 19:17:00 Leo

Este truco siguiente conserva espacios en blanco en innerText en IE

var cloned = element.cloneNode(true); 
var pre = document.createElement("pre"); 
pre.appendChild(cloned); 
var textContent = pre.textContent 
    ? pre.textContent 
    : pre.innerText; 
delete pre; 
delete cloned;

Fuente

2009-01-13 21:57:18

Si alguien pudiera formatear mi última publicación correctamente, se vería más legible. Lo siento, lo arruiné. Básicamente, el truco es crear crear un elemento previo desechable, luego anexar una copia de su nodo a eso. Luego puede obtener innerText o textContent dependiendo del navegador.

Todos los navegadores excepto IE básicamente hacen lo obvio correctamente. IE requiere este truco, ya que solo conserva el espacio en blanco en elementos previos, y solo cuando se accede a innerText.

Fuente

2009-01-13 22:00:23

Javascript ¿Eliminar espacios en blanco cuando no debería?

Respuesta

Cuestiones relacionadas