jquery获取所有的input的name

原创

mob649e81567471 2024-06-18 03:37:24 ©著作权

文章标签 jQuery 表单选择器 文章分类 jQuery 前端开发

©著作权归作者所有：来自51CTO博客作者mob649e81567471的原创作品，请联系作者获取转载授权，否则将追究法律责任

使用jQuery获取所有的input的name

在web开发中，我们经常需要通过JavaScript来操作页面上的元素。而jQuery是一个广泛使用的JavaScript库，它提供了简洁的API，使得操作DOM更加方便和高效。

在本文中，我们将探讨如何使用jQuery来获取页面上所有input元素的name属性，并展示一个简单的示例。

什么是input元素的name属性？

在HTML中，input元素是常用的表单元素，用于接收用户输入。每个input元素都可以有一个name属性，用来标识该表单元素在提交表单时对应的字段名称。

<input type="text" name="username" placeholder="Username">

在上面的例子中，input元素有一个name属性为"username"。

使用jQuery获取所有input的name

要获取页面上所有input元素的name属性，我们可以使用jQuery提供的选择器来选中这些元素，然后通过遍历的方式获取它们的name属性。

$(document).ready(function() {
    $('input').each(function() {
        var name = $(this).attr('name');
        console.log(name);
    });
});

在上面的代码中，我们首先在页面加载完成后执行一个函数，然后使用选择器$('input')选中所有的input元素。接着，我们通过.each()方法遍历每个选中的input元素，并使用$(this).attr('name')方法获取其name属性的值。最后，我们通过console.log()方法将name属性打印出来。

示例

假设我们有一个简单的HTML表单，包含几个input元素：

<form>
    <input type="text" name="username" placeholder="Username">
    <input type="password" name="password" placeholder="Password">
    <input type="email" name="email" placeholder="Email">
</form>

我们可以使用上面的jQuery代码来获取这些input元素的name属性，并在控制台中打印出来。当页面加载完成后，我们将看到以下输出：