Home > Web Front-end > JS Tutorial > body text

How to get the value of input in JS?

Guanhui
Release: 2020-06-04 09:56:48
Original
10473 people have browsed it

How to get the value of input in JS?

#JS How to get the value of input?

First use "querySelector()" to obtain the element object, and only need to pass the input selection rules to this method;

Code example

Copy after login
var inputEl = document.querySelector('[name="username"]');
Copy after login

Finally, The value attribute in the input element object is the value of the input, so you only need to get this attribute.

var inputEl = document.querySelector('[name="username"]');

var val = inputEl.value;

console.log(val);
Copy after login

input attribute HTML5

##AttributeValueDescriptionacceptSpecifies the type of file submitted via file upload. alignalttextDefine the alternative text for the image input. autocompleteSpecifies whether to use the input field autocomplete feature. autofocusautofocuscheckedcheckedSpecifies that this input element is the first time Should be selected when loading. disableddisabledDisables this element when the input element loads. form Specifies one or more forms to which the input field belongs. formactionformenctypeSee noteformmethodformnovalidateformnovalidateformtarget
mime_type
    left
  • right
  • top
  • middle
  • bottom
Deprecated. Specifies the alignment of image input.
    on
  • off
Specifies whether the input field gets focus when the page loads.

(Not applicable to type="hidden")

formname
URL Override the action attribute of the form.

(Applies to type="submit" and type="image")

Override the enctype attribute of the form.

(Applies to type="submit" and type="image")

    get
  • post
Override the method attribute of the form.

(Applies to type="submit" and type="image")

Override the novalidate attribute of the form.

If this attribute is used, validation will not be performed when submitting the form.

    _blank
  • _self
  • _parent
  • _top
  • framename
Override the form's target attribute.

(Applies to type="submit" and type="image")

height
  • pixels
  • %
Define the height of the input field. (Applies to type="image")
list datalist-id refers to a predefined containing input field datalist of options.
max
  • number
  • date

Specifies the maximum value of the input field.

Please use it with the "min" attribute to create a range of legal values.

maxlength number Specifies the maximum length of characters in the input field.
min
  • number
  • date

Specifies the minimum value of the input field.

Please use it with the "max" attribute to create a range of legal values.

multiple multiple If this attribute is used, more than one value is allowed.
name field_name Define the name of the input element.
pattern regexp_pattern

Specifies the pattern or format of the value of the input field.

For example, pattern="[0-9]" means that the input value must be a number between 0 and 9.

placeholder text Specifies prompts to help the user fill in the input field.
readonly readonly Specifies that the input field is read-only.
required required Indicates that the value of the input field is required.
size number_of_char Define the width of the input field.
src URL Defines the URL of the image displayed as a submit button.
step number Specifies the legal digit interval of input characters.
type
  • button
  • checkbox
  • file
  • hidden
  • image
  • password
  • radio
  • reset
  • submit
  • text
Specify the type of input element.
value value Specifies the value of the input element.
width
  • pixels
  • %
Define the width of the input field. (Applicable to type="image")
##Recommended tutorial: "

JS Tutorial"

The above is the detailed content of How to get the value of input in JS?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
js
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!