Como atribuir valor à caixa de texto usando JavaScript

Como Atribuir Valor A Caixa De Texto Usando Javascript



Às vezes, pode ser necessário definir um valor de 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 tem métodos predefinidos que podem ser úteis para o propósito declarado.

Este post 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:







Vejamos o funcionamento desses métodos separadamente!



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

O ' setAtributo() ” é usado para atribuir um valor à caixa de texto. É utilizado para adicionar ou definir um atributo para um determinado elemento e dar-lhe um valor. Esse método recebe dois parâmetros como argumento e ambos são obrigatórios.



Sintaxe





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

setAtributo ( attributeName, attributeValue ) ;

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



Exemplo

Vamos primeiro criar um cabeçalho 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:

< h5 > Clique no botão para ver o predefinição valor do campo de texto. h5 >

< tipo de entrada = 'texto' Eu iria = 'meuTexto' marcador de posição = 'Texto' >

< botão ao clicar = 'minhaFunção()' > Clique botão >

No arquivo JS, defina uma função chamada “ minhaFunção() ” e acesse a caixa de texto usando “ getElementbyId() ” e, em seguida, defina o valor com a ajuda de “ setAtributo() ” método:

função minhaFunção ( ) {

documento. getElementById ( 'meuTexto' ) . setAtributo ( 'valor' , '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 de valor de texto

Existe outra abordagem para atribuir valor à caixa de texto, que é o “ valor ” propriedade 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:

valor = 'Texto' ;

Exemplo

Aqui, vamos atribuir o valor à caixa de texto já criada no exemplo anterior. Para isso, acesse a caixa de texto no myFunction() e, em seguida, atribua o valor necessário à caixa de texto usando o “ valor ' propriedade:

função minhaFunção ( ) {

documento. getElementById ( 'meuTexto' ) . valor = '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 de JavaScript chamado método setAttribute() ou a propriedade value do elemento de texto. Ambas as abordagens funcionam eficientemente para atribuir valor à caixa de texto. Você pode selecionar um deles conforme sua necessidade. Neste post, discutimos as abordagens para atribuir o valor à caixa de texto usando JavaScript com exemplos detalhados.