如何在 JavaScript 中获取输入值
使用 document.getElementById(id_name) 来获取 JavaScript 中的输入值
在 JavaScript 中使用 document.getElementsByClassName('class_name') 来获取输入值
使用 document.querySelector('selector') 来获取 JavaScript 中的输入值
在 JavaScript 中，我们可以通过选择 DOM 输入元素并使用 value 属性来获取输入值，而不需要将其包裹在表单元素中。
JavaScript 有不同的方法来选择 DOM 输入元素。下面的每个方法都有一个代码示例，你可以在你的机器上运行。
使用 document.getElementById(id_name) 来获取 JavaScript 中的输入值
我们给 DOM 输入元素赋予 id 属性，然后用 document.getElementById(id_name) 来选择 DOM 输入元素，你可以直接使用 value 属性。
例子
Change the text of the text field
,and then click the button.
click me!!
在 JavaScript 中使用 document.getElementsByClassName('class_name') 来获取输入值
我们给 DOM 输入元素赋予 class 属性，然后用 document.getElementsByClassName('class_name') 来选择 DOM 输入元素，但是如果我们有不同的 DOM 输入元素有相同的 class 名称，那么它将返回一个 DOM 输入数组，所以我们应该通过给出索引号来指定选择哪一个：document.getElementsByClassName('class_name')[index_number].value。
例子
Change the text of the text field
,and then click the button.
click me!!
使用 document.querySelector('selector') 来获取 JavaScript 中的输入值
document.querySelector('selector') 使用 CSS 选择器，也就是说，它可以通过 DOM 元素的 id、class、tag 名和 name 属性来选择元素。
例子: document.querySelector('selector')
document.querySelector('class_name')
document.querySelector('id_name')
document.querySelector('input') // tag name
document.querySelector('[name="domTextElement"]') // name property
例子：
Change the text of the text field
,and then click the button.
click me!!
Enjoying our tutorials? Subscribe to DelftStack on YouTube to support us in creating more high-quality video guides. Subscribe