Como atribuir valor à caixa de texto usando JavaScript

Às vezes, pode ser necessário definir um valor da caixa de texto com base em qualquer evento. Você pode fazer isso adicionando um elemento de caixa de texto de entrada no arquivo html e definindo seu valor de atributo com base no requisito. JavaScript possui métodos predefinidos que podem ser úteis para o propósito declarado.

Esta postagem definirá o procedimento para atribuir valor à caixa de texto usando JavaScript.

Como atribuir valor à caixa de texto usando JavaScript?

Para atribuir valor à caixa de texto, use os seguintes métodos:

• Usando o método setAttribute ()
• Usando a propriedade de valor de texto

Vejamos o funcionamento desses métodos separadamente!

Método 1: Atribuir valor à caixa de texto usando o método setAttribute ()

O "setAttribute ()”O método é usado para atribuir um valor à caixa de texto. É utilizado para adicionar ou definir um atributo a um certo elemento e dar um valor. Este método leva dois parâmetros como argumento, e ambos são obrigatórios.

Sintaxe

Siga a sintaxe mencionada abaixo para o método setAttribute ():

setAttribute (atributeName, attributeValue);

Aqui, "Valor do atributo”É o valor do atributo cujo nome é especificado.

Exemplo

Primeiro criaremos um título e um campo de entrada com o padrão “Texto”Valor de espaço reservado. Em seguida, adicione um botão que invocará o método "MyFunction ()" quando for clicado:

Clique no botão para ver o valor padrão do campo de texto.

Clique

No arquivo JS, defina uma função chamada “MyFunction ()”E acesse a caixa de texto usando“getElementById ()”Método e, em seguida, defina o valor com a ajuda de“setAttribute ()”Método:

function myfunction ()
documento.getElementById ("MyText").setattribute ('value', 'linuxhint');

Pode ser visto na saída que, quando o botão é clicado, o valor da caixa de texto é definido como “Linuxhint”:

Vamos ver o próximo procedimento para atribuir valor à caixa de texto.

Método 2: Atribuir valor à caixa de texto usando a propriedade Valor do texto

Há outra abordagem para atribuir valor à caixa de texto, que é o “valorPropriedade do texto. Nesta abordagem, você só precisa atribuir o valor à caixa de texto usando a propriedade Value.

Sintaxe

Use a seguinte sintaxe para atribuir valor a uma caixa de texto usando a propriedade Value do elemento de texto:

value = "texto";

Exemplo

Aqui, atribuiremos o valor à caixa de texto já criada no exemplo anterior. Para fazer isso, acesse a caixa de texto no myfunction () e, em seguida, atribua o valor necessário à caixa de texto usando o “valor" propriedade:

function myfunction ()
documento.getElementById ("MyText").value = "linuxhint";

Como você pode ver a saída com sucesso, atribua o valor à caixa de texto:

Reunimos as abordagens mais simples para atribuir valor à caixa de texto usando JavaScript.

Conclusão

Para atribuir valor à caixa de texto usando JavaScript, você pode usar o método predefinido JavaScript chamado Método SetAttribute () ou a propriedade Valor do elemento de texto. Ambas as abordagens funcionam com eficiência para atribuir valor à caixa de texto. Você pode selecionar um deles conforme sua exigência. Neste post, discutimos as abordagens para atribuir o valor à caixa de texto usando JavaScript com exemplos detalhados.