js 获取input的value值三种方式
在前端开发中，经常会涉及到获取用户输入的数据。而获取input标签的value值是一种常见的操作。本文将介绍如何使用JavaScript获取input标签的value值，包括三种不同的方式。
1. 使用document.getElementById()
这是最常见的一种方式，通过document.getElementById()方法获取input标签的元素，然后获取其value属性值。
在上面的示例中，我们首先使用document.getElementById()方法获取id为myInput的input标签元素，然后通过value属性获取其值。当点击按钮时，会在控制台输出input标签的值。
2. 使用document.querySelector()
另一种常见的方式是使用document.querySelector()方法来选择input标签，然后获取其value值。
在这个示例中，我们通过document.querySelector()方法选择id为myInput的input标签元素，然后同样通过value属性获取其值。当点击按钮时，同样会在控制台输出input标签的值。
3. 使用事件监听器
除了上面两种方法，我们还可以使用事件监听器来实时获取input标签的值。这种方式可以在用户不断输入时实时获取值。
在这个示例中，我们给id为myInput的input标签元素添加了一个input事件监听器。当用户输入时，会实时获取其值并输出到控制台。
结论
通过上述三种方式，我们可以方便地获取input标签的值。在实际开发中，可以根据需求选择使用哪种方式。如果是简单的获取值操作，可以使用document.getElementById()或document.querySelector()方法；如果需要实时获取输入值，可以使用事件监听器。