获取 <input> 的属性名称值答案

【问题标题】：Get attribute name value of <input>获取 <input> 的属性名称值
【发布时间】：2011-03-31 15:20:34
【问题描述】：

如何使用 jQuery 获取输入标签的属性名称值。请帮忙。

<input name="xxxxx" value="1">

【问题讨论】：

标签： jquery

【解决方案1】：

为您的输入提供一个 ID 并使用 attr 方法：

var name = $("#id").attr("name");

【讨论】：

【解决方案2】：

像这样使用jQuery的attr方法：

alert($('input').attr('name'));

请注意，您也可以使用attr 通过指定第二个参数来设置属性值：

$('input').attr('name', 'new_name')

【讨论】：

【解决方案3】：

虽然不可否认 jQuery 是一个强大的工具，但将它用于“获取元素的属性值”这样的琐碎操作是一个非常糟糕的主意。

根据当前接受的答案判断，我将假设您能够向元素添加 ID 属性并使用它来选择它。

考虑到这一点，这里有两段代码。一、Accepted Answer中给你的代码：

$("#ID").attr("name");

其次，它的Vanilla JS 版本：

document.getElementById('ID').getAttribute("name");

我的结果：

jQuery：30 万次操作/秒
JavaScript：1100 万次操作/秒

您可以自己测试here。 “纯 JavaScript”版本比 jQuery 版本快 35 倍以上。

现在，这只是一项操作，随着时间的推移，您的代码中将包含越来越多的内容。也许对于特别高级的东西，最佳的“纯 JavaScript”解决方案需要一秒钟才能运行。 jQuery 版本可能需要 30 秒到一分钟！那是巨大的！人们不会为此而坐以待毙。甚至浏览器也会感到厌烦，并为您提供因耗时过长而终止网页的选项！

正如我所说，jQuery 是一个强大的工具，但它不应被视为the answer to everything。

【讨论】：

不错的答案，我交叉检查了，所以 javascript 比 jquery 更快，对吧？
您在提出该问题 4 年后回答了此问题，但您没有回答该问题。该人问如何在jQuery中做到这一点。使用 jQuery 还是 Vanilla JS 取决于程序员，这超出了问题的范围
原版JS!??开玩笑，我花了半个小时研究 hack Vanilla JS 是什么。
也许开发者不知道。我知道像 jQuery 这样的框架会导致一些开销。但是我没想到在使用 jQuery 时会在 35 因子中减慢这些简单的任务...

【解决方案4】：

var value_input = $("input[name*='xxxx']").val();

【讨论】：

这篇文章被自动标记为低质量，因为它太短/只有代码。您介意通过添加一些文本来解释它是如何解决问题的吗？
实际上并不能解决问题。 OP想要获取名称值；这假设你已经知道了。
这没有得到'name'属性的值

【解决方案5】：

您需要编写一个选择器，首先选择正确的<input>。理想情况下，您使用元素的 ID $('#element_id')，而不是容器的 ID $('#container_id input') 或元素的类 $('input.class_name')。

你的元素没有这些也没有上下文，所以很难告诉你如何选择它。

一旦找到合适的选择器，就可以使用attr 方法来访问元素的属性。要获取名称，您将使用 $(selector).attr('name') 它将返回（在您的示例中）'xxxxx'。

【讨论】：

【解决方案6】：

更好的方法是使用“this”，它采用“id”的名称并使用它。只要你添加名为'mytarget'的类名。

只要有目标的任何字段发生变化，它就会显示一个带有该字段名称的警告框。只需剪切并过去整个脚本即可运行！

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
 $('.mytarget').change(function() {
var name1 = $(this).attr("name");
alert(name1);
 });
});
</script>

Name: <input type="text" name="myname" id="myname" class="mytarget"><br />
Age: <input type="text" name="myage" id="myage" class="mytarget"><br />

【讨论】：

【解决方案7】：

var theName;

theName = $("input selector goes here").attr("name");

【讨论】：

【解决方案8】：

使用值获取输入名称

 $('input[value="1"]').attr('name');

使用 id 获取输入名称

 $('input[class="id"]').attr('name');
   $('#id').attr('name');

使用类获取输入名称

 $('input[value="classname"]').attr('name');
   $('.classname').attr('name');  //if classname have unique value

【讨论】：

【解决方案9】：

如果您处理的是单个元素，最好使用 GenericTypeTea 答案中所述的id 选择器，并获得类似$("#id").attr("name"); 的名称。

但是，如果您想要，就像我在发现这个问题时所做的那样，包含特定类的所有输入名称的列表（在我的示例中，是带有 @ 的所有未选中复选框名称的列表987654323@ class) 你可以这样做：

var listOfUnchecked = $('.selectable-checkbox:unchecked').toArray().map(x=>x.name);

或

var listOfUnchecked = [];
$('.selectable-checkbox:unchecked').each(function () {
    listOfUnchecked.push($(this).attr('name'));
});

【讨论】：

【解决方案10】：

将类传递给输入标签并使用类访问名称值。

<input class="test-class" name='xxxxx' value=1>

<script>
    $('.test-class').attr('name');
</script>

或者您也可以使用 id 访问该值。

<input id="test-id" name='xxxxx' value=1>

<script>
    $('#test-id').attr('name');
</script>

【讨论】：

【解决方案11】：

对于下面的行，最初遇到的问题是没有给出“currnetRowAppName”值没有占用字符串空间的单个代码。因此，在给出单个代码'"+row.applicationName+"' 之后，它也占用了空间。

示例：

<button class='btn btn-primary btn-xs appDelete' type='button' currnetRowAppName='"+row.applicationName+"' id="+row.id+ >

var viewAppNAME = $(this).attr("currnetRowAppName");
alert(viewAppNAME)

这工作正常。

【讨论】：