Se puede hacer este código más chico? (es decir que ocupe menos espacio)

hgp147 · #1 (**permalink**) 22/12/2007, 18:42

Hola, quería saber si el código de abajo se podía hacer más chico, es decir que ocupe menos espacio.

Código HTML:

<html>
<head>

<script type="text/javascript">

function validar(frm) {

  var resultado1 = frm.nombre_usuario.value.length > 3;
  var resultado2 = frm.contrasenia.value.length > 6;
  var resultado3 = frm.email.value.length > 8;

  document.getElementById('error_nombre_usuario').style.display = (resultado1) ? 'none':'block';
  document.getElementById('ingreso').style.borderColor = (resultado1) ? 'black':'red';
  document.getElementById('ingreso').style.color = (resultado1) ? 'black':'red';



  document.getElementById('error_contrasenia').style.display = (resultado2) ? 'none':'block';
  document.getElementById('contrasenia').style.borderColor = (resultado2) ? 'black':'red';
  document.getElementById('contrasenia').style.color = (resultado2) ? 'black':'red';


  document.getElementById('error_email').style.display = (resultado3) ? 'none':'block';
  document.getElementById('email').style.borderColor = (resultado3) ? 'black':'red';
  document.getElementById('email').style.color = (resultado3) ? 'black':'red';
  
  return  (resultado1 && resultado2 && resultado3);
}
</script>

</head>
<body>

<input type="text" name="nombre_usuario" id="ingreso">

<div class="texto_error" id="error_nombre_usuario">Nombre de usuario no v&aacute;lido</div>




<input type="password" name="contrasenia" id="contrasenia">

<div class="texto_error" id="error_contrasenia">Contrase&ntilde; no v&aacute;lido</div>




<input type="text" name="email"  id="email">

<div class="texto_error" id="error_email">Email no  v&aacute;lido</div>


</body>
</html>

Muchas gracias!

derkenuke · #2 (**permalink**) 22/12/2007, 20:11

Hola hgp147:

No le veo manera de empequeñecerlo demasiado... podrías abreviar document.getElementById() en una función, por ejemplo $(), pero por lo demás no veo necesidad de empequeñecerlo...

Al fin y al cabo, son 3 declaraciones, 9 lineas y 1 return que nada tienen que ver entre sí... no me parece que la fórmula para acortarlo pueda mantener un poco de legibilidad ni nos lleve a ningún sitio.

Si te quieres ahorrar bytes lo dicho, el $().

He intentado algo, pero no se puede leer casi:

Código PHP:

  <html>

<head>

 
<script type="text/javascript">

 
 
function estilar() {

    var st = ['display','borderColor','color'];

    for(var i=0, l=arguments.length; i<l; i+=2)

        for(var j=0, ce=true; j<3; j++, ce=(j%3==0) )

            document.getElementById( (ce?'error_':'')+arguments[i] ).style[ st[j] ] = (st[j]=='display')? (arguments[i+1]?'none':'block') : (arguments[i+1]?'black':'red');

}

 
function validar(frm) {

 
    var resultado1 = frm.nombre_usuario.value.length > 3;

    var resultado2 = frm.contrasenia.value.length > 6;

    var resultado3 = frm.email.value.length > 8;

 
    estilar('ingreso', resultado1, 'contrasenia', resultado2, 'email', resultado3);

    

    return  (resultado1 && resultado2 && resultado3);

}

</script>

 
</head>

<body>

 
<form onsubmit="alert(validar(this)); return false;">

    <input type="text" name="nombre_usuario" id="ingreso" />

    <div class="texto_error" id="error_ingreso">Nombre de usuario no v&aacute;lido</div>

    <input type="password" name="contrasenia" id="contrasenia" />

    <div class="texto_error" id="error_contrasenia">Contrase&ntilde;a no v&aacute;lida</div>

    <input type="text" name="email" id="email" />

    <div class="texto_error" id="error_email">Email no v&aacute;lido</div>

    <input type="submit" value="manda" />

</form>

 
</body>

</html>

Yo no lo haría; y si lo hiciera lo escribiría de tal manera de que dentro de 3 meses sin acordarme de nada lo pudiera leer sin romperme la cabeza, hay que tener en cuenta la mantenibilidad del código antes de su tamaño en bytes de vez en cuando.

Un saludo