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!

Carlos Dk

Apasionado por la enseñanza y el SEO

18 comentarios en “Asignar valor a un objeto html con Javascript utilizando document.getElementById

  • el 27 junio, 2014 a las 4:32 am
    Permalink

    Siempre y cuando este dentro de un

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

    sino tira error

    Respuesta
    • el 30 agosto, 2020 a las 2:52 am
      Permalink

      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!.

      Respuesta
  • el 27 junio, 2014 a las 9:46 am
    Permalink

    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 😉

    Respuesta
  • el 19 octubre, 2016 a las 3:07 pm
    Permalink

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

    Respuesta
    • el 24 octubre, 2016 a las 10:56 am
      Permalink

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

      Un saludo!

      Respuesta
  • el 10 enero, 2017 a las 11:40 pm
    Permalink

    Me gustaría saber como asignar valores en un for

    Respuesta
    • el 11 enero, 2017 a las 12:48 pm
      Permalink

      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 😉

      Respuesta
  • el 13 enero, 2017 a las 11:00 pm
    Permalink

    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!!

    Respuesta
    • el 13 enero, 2017 a las 11:58 pm
      Permalink

      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!

      Respuesta
  • el 12 marzo, 2019 a las 2:30 am
    Permalink

    Esta en javascript o jquery???

    Respuesta
  • el 9 diciembre, 2019 a las 12:46 am
    Permalink

    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

    Respuesta
    • el 10 diciembre, 2019 a las 9:16 am
      Permalink

      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 🙂

      Respuesta
  • el 10 marzo, 2020 a las 4:53 am
    Permalink

    Excelente, muy buena explicación.

    Respuesta
  • el 12 noviembre, 2021 a las 4:05 am
    Permalink

    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

    Respuesta

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.