Asignar valor a un objeto html con Javascript utilizando document.getElementById

En este nuevo tutorial de javascript y de forma muy rápida, vamos a explicar como dar o asignar un valor a una caja de texto (inputbox) de html, para ello utilizaremos document.getElementById(), pero primero pongamos el objeto en cuestión:

<form name=»frmTabla» id=»frmTabla»>
<input name=»txtTabla» type=»text» id=»txtTabla» value=»»>
</form>

Una vez que tenemos declarado el objeto, veamos como asignar el valor:

document.getElementById(«txtTabla»).value = «Tutorial Javascript»;

Esto añadiría el string «Tutorial Javascript» a la caja de texto designada con el id «txtTabla»

Así de sencillo!

Un saludo!

Comments (18)

  • Fredd 27 junio, 2014

    Siempre y cuando este dentro de un

    window.onload = function(){
    document.getElementById(‘widget-generalcode’).innerHTML = ‘test’;
    };

    sino tira error

    Reply
    • Jesus David 30 agosto, 2020

      Gracias!!. Llevaba casi una hora intentando cargar un input desde javascript. Efectivamente haciendo uso del onload funcionó. De hecho construí una función y ni llamando la función se solucionó. Gracias de nuevo!.

      Reply
      • Carlos Dk 31 agosto, 2020

        Gracias por tu comentario. Me alegra saber que ayuda! 😉

        Reply
  • videotutoriales 27 junio, 2014

    Como bien dices Fredd, hay que añadirlo dentro de alguna función, en tu caso en el evento load del documento.

    Gracias por el aporte 😉

    Reply
  • Jose Lema 19 octubre, 2016

    amigo disculpa, en mi caso no tengo el id del input, solo tengo el name, como podria hacer en ese caso

    Reply
    • Carlos Dk 24 octubre, 2016

      Cambia la función getElementById por getelementsbyname y asignale el nombre. El resultado ha de ser exactamente igual.

      Un saludo!

      Reply
  • David Espinoza 10 enero, 2017

    Me gustaría saber como asignar valores en un for

    Reply
    • Carlos Dk 11 enero, 2017

      Necesito que me expliques un poco más, un for es una iteración sabiendo la totalidad de elementos, pero ¿asignar los valores a qué?

      Espero tu respuesta 😉

      Reply
  • Moises Gaytan 13 enero, 2017

    Me pueden ayudar con el mismo ejemplo pero viceversa, asignar el texto de un input a una variable JavaScript. Lo intento hacer para imprimir lo que capture en un alert pero me sale INDEFINIDE. Ayuda Por favor!!

    Reply
    • Carlos Dk 13 enero, 2017

      Bueno, por lógica debería de hacerse alert(document.getElementById(“txtTabla”).value);

      Aunque por facílidad, te recomiendo utilizar JQuery, es mucho más sencillo y rápido de entender 😉

      Un saludo!

      Reply
  • Fernando 12 marzo, 2019

    Esta en javascript o jquery???

    Reply
    • Carlos Dk 14 marzo, 2019

      Este código es javascript.

      Reply
  • Diaz 30 noviembre, 2019

    tlaxtlaoij= Gracias

    Reply
  • Aldair 9 diciembre, 2019

    me podrían ayudar tengo el siguiente campo:

    el valor del input es 100 como puedo hacer para cambiar ese valor y que muestre esto

    como puedo hacerlo con javascript

    Reply
    • Carlos Dk 10 diciembre, 2019

      Los comentarios no aceptan código como tal, deberás de escribirlo con algún espacio para que no se parsee y oculte.
      Así quizás te pueda ayudar 🙂

      Reply
  • Armando 10 marzo, 2020

    Excelente, muy buena explicación.

    Reply
    • Carlos Dk 10 marzo, 2020

      Gracias!

      Reply
  • Pedro Moreno 12 noviembre, 2021

    Hola colegas:

    Yo me pare en esta parte, al final pude resolver asi:

    En JS
    $(«input[name=NOMBRE_DEL_INPUT]»).val(VARIABLE);

    En el HTML

    Y ya pude recibir el dato en el INPUT directo desde el JS

    Reply

Leave a comment

Sign in to post your comment or sine up if you dont have any account.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Tu software de gestión


Últimas preguntas:

Logo Dkreativo
Vertutoriales