2

Yo tengo este HTML, y quiero poder acceder al input del teléfono, ¿cómo lo haria? Sin utilizar el atributo id ,con el queryselector llegaria al primero, ¿pero con los demás? He pensado en poner un bucle for y cuando llegue al tercer text pues que haga el trabajo. Pero lo veo una manera un poco complicada, si tienes que hacer un bucle for para todos..

Pongo este pequeño código como ejemplo:

    <form>
        <label for="nombre">Nombre </label><input type="text"><br>
        <label for="apellidos">Apellidos </label><input type="text"><br>
        <label for="telefono">Telefono </label><input type="text"/> <br>
        <label for="dni">DNI </label><input type="text" ><br>
        <label for="edad">Edad </label><input type="text"><br>
        <label for="sexo">Sexo</label><br>
        
    </form>

3
  • Necesitas alguna forma de identificar cada input ya sea con class o con name.
    – alanfcm
    Commented el 10 dic. 2019 a las 22:32
  • Pregunta: ¿por qué no usas el id? ¿Es un ejercicio y te impiden usarlo?
    – A. Cedano
    Commented el 10 dic. 2019 a las 22:41
  • Asi es para no utilizar nada de HTML Commented el 11 dic. 2019 a las 8:07

2 respuestas 2

3

A través de la función querySelectorAll podrías recuperar todos los elementos <input> y acceder directamente al que más te interese a través de su posición dentro el array.

<form>
    <label for="nombre">Nombre </label><input type="text" value="nombre"><br>
    <label for="apellidos">Apellidos </label><input type="text" value="apellidos"><br>
    <label for="telefono">Telefono </label><input type="text" value="telefono"> <br>
    <label for="dni">DNI </label><input type="text" value="dni"><br>
    <label for="edad">Edad </label><input type="text" value="edad"><br>
    <label for="sexo">Sexo</label><br>
</form>

<script>
  
  var inputs = document.querySelectorAll("input");
  
  console.log(inputs[0].value); //Para el valor del input nombre
  console.log(inputs[1].value); //Para el valor del input apellidos
  console.log(inputs[2].value); //Para el valor del input teléfono
  console.log(inputs[3].value); //Para el valor del input DNI
  console.log(inputs[4].value); //Para el valor del input edad
  
</script>

1
  • perfecto, es lo que buscaba Commented el 11 dic. 2019 a las 9:14
2

Puedes probar lo siguiente:

var inputTelefono = document.querySelector('label[for="telefono"]').nextSibling;

Aunque si usas label="valor", debes tener un elemento input que tenga un id="valor":

<label for="telefono">Telefono </label><input type="text" id="telefono">

Y además los input deben tener name, que será el valor de la variable en el destino del form:

<label for="telefono">Telefono </label><input type="text" name="telefono" id="telefono">

Y te recomiendo que uses HTML5

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.