Página 1 de 1

Insertar espacio en JavaScript

NotaPublicado: 2007-08-07 03:33 @190
por marcosss
Hola, estoy creando un elemento con varios inputs dinámicamente en JavaScript y para separar un input de otro inserto saltos de línea (<br>) porque si inserto un espacio (&nbsp;) no me sale nada, me falla el script JavaScript, me dice que he insertado un carácter inválido.

Para insertar un salto de línea lo hacía:
Código: Seleccionar todo
txt = document.createElement('<br>');
contenedor.appendChild(txt);


Y ahora para insertar un espacio en blanco:
Código: Seleccionar todo
txt = document.createElement('&nbsp;');
contenedor.appendChild(txt);


Muchas gracias

NotaPublicado: 2007-08-07 04:15 @219
por explorer
¿Y no es más cómodo usar el 'write'?

NotaPublicado: 2007-08-07 04:22 @224
por marcosss
Pero es que los elementos los inserto dinámicamente, un ejemplo:

Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
<script type="text/javascript">

num=0;
function crearHermano(obj) {
  num++;
                        //Creamos los datos del hermano
 
  papa = obj.parentNode;
  hermano = obj.nextSibling;

  num++;
  contenedor = document.createElement('div');
  contenedor.id = 'div'+num;
  if (hermano == undefined)
        papa.appendChild(contenedor)
               
  else
        papa.insertBefore(contenedor, hermano)

  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
 
  txt = document.createTextNode('DNI: ');                       //Creamos el DNI       
  ele = document.createElement('input');
  ele.type = 'text';
  ele.name = 'cDNIH'+num;
  contenedor.appendChild(txt);
  contenedor.appendChild(ele);
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
       
                                                                                                        //Creamos el nombre
  txt = document.createTextNode('Nombre: ');
  ele = document.createElement('input');
  ele.type = 'text';
  ele.name = 'cNombreH'+num;
  ele.size = '40';
  contenedor.appendChild(txt);
  contenedor.appendChild(ele);
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
 
  txt = document.createTextNode(' Edad: ');                     //Creamos la edad
  ele = document.createElement('input');
  ele.type = 'text';
  ele.name = 'cEdadH'+num;
  ele.size='5';
  contenedor.appendChild(txt);
  contenedor.appendChild(ele);


  txt = document.createTextNode(' Estado civil: ');                     //Creamos el estado civil (es un select con varias opciones)
  ele = document.createElement('select');
  ele.name = 'cEstadoCivilH'+num;

  opt = document.createElement('option');                      
  opt.value = 'Soltero';
  opt.text =  'Soltero';
  ele.appendChild(opt);

  opt = document.createElement('option');                      
  opt.value = 'Casado';
  opt.text =  'Casado';
  ele.appendChild(opt);

  opt = document.createElement('option');                      
  opt.value = 'Separado';
  opt.text =  'Separado';
  ele.appendChild(opt);

  opt = document.createElement('option');                      
  opt.value = 'Viudo';
  opt.text =  'Viudo';
  ele.appendChild(opt);

  contenedor.appendChild(txt);
  contenedor.appendChild(ele);


 
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
  txt = document.createElement('<br>');                 // Meto un salto de línea
  contenedor.appendChild(txt);
  txt = document.createTextNode(' Estudios: ');                 //Creamos los estudios
  ele = document.createElement('input');
  ele.type = 'text';
  ele.name = 'cEstudiosH'+num;
  contenedor.appendChild(txt);
  contenedor.appendChild(ele);
 
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);  

  txt = document.createTextNode(' Profesión: ');                       //Creamos la profesión
  ele = document.createElement('input');
  ele.type = 'text';
  ele.size= '40';
  ele.name = 'cProfesionH'+num;
  contenedor.appendChild(txt);
  contenedor.appendChild(ele);
   
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);  
 
 
  txt = document.createTextNode(' Situación laboral: ');                       //Creamos la situación laboral (es un select con varias opciones)
  ele = document.createElement('select');
  ele.name = 'cSituacionLaboralH'+num;

  opt = document.createElement('option');                      
  opt.value = 'Activo';
  opt.text =  'Activo';
  ele.appendChild(opt);

  opt = document.createElement('option');                      
  opt.value = 'Desempleado';
  opt.text =  'Desempleado';
  ele.appendChild(opt);

  opt = document.createElement('option');                      
  opt.value = 'Sus labores';
  opt.text =  'Sus labores';
  ele.appendChild(opt);

  opt = document.createElement('option');                      
  opt.value = 'Invalidez';
  opt.text =  'Invalidez';
  ele.appendChild(opt);

  contenedor.appendChild(txt);
  contenedor.appendChild(ele);

 
 
 
  txt = document.createElement('<br>');                         // Meto un salto de línea
  contenedor.appendChild(txt);
  ele = document.createElement('input');
  ele.type = 'button';
  ele.value = 'Borrar';
  ele.name = 'div'+num;
  ele.onclick = function () {borrar(this.name,obj)}
  contenedor.appendChild(ele);
 
}

</script>
Coloreado en 0.004 segundos, usando GeSHi 1.0.8.4


¿Aquí se puede usar un write?

NotaPublicado: 2007-08-07 04:38 @235
por explorer
Pues... ¿se hace con un document.createTextNode('&nbsp;&nbsp;'); y lo agregas con appendChild() al flujo del contenedor?

NotaPublicado: 2007-08-07 04:44 @239
por marcosss
No, que va, esto no me funciona:

espacio = document.createTextNode('&nbsp;');
contenedor.appendChild(espacio);

Me escribe el &nbsp;

NotaPublicado: 2007-08-07 05:58 @290
por explorer
Pero... vamos a ver... ¿tu quieres imprimir en espacio en blanco o espacio en blancos no reducibles (nbsp)?

NotaPublicado: 2007-08-07 10:11 @466
por marcosss
Yo quiero imprimir espacios en blanco, quiero que los elementos DNI y Nombre estén separados por unos cuantos espacios en blano, pero no lo consigo. He probado ya:
- espacio = document.createTextNode(' ');
contenedor.appendChild(espacio);

- espacio = document.createTextNode('&nbsp;');
contenedor.appendChild(espacio);

- espacio = document.createTextNode('&nbsp');
contenedor.appendChild(espacio);

pero nada me funciona, no consigo imprimir ningún espacio en blanco.

NotaPublicado: 2007-08-07 10:42 @487
por kidd
Intenta con:

Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
var espacio = document.createTextNode("\u00a0");
Coloreado en 0.000 segundos, usando GeSHi 1.0.8.4


Con la secuencia \u metemos el valor en unicode del espacio no reducible.

Saludos

NotaPublicado: 2007-08-07 10:58 @498
por marcosss
OK muchas gracias, ya sale