如何使用纯/本地javascript获取按名称的元素html标记？

如何使用纯/本地Javascript获取或扫描不同输入标记名的元素？有5个输入，分别是名字、中间名和姓氏、地址和出生日期。但我只想获取特定的输入标记，并用alert或msgbox显示它。见下文

下面是html标记：

<form name="test">
<tr>
        <td bgcolor="#e9e9e9"><input type="text" name="FIELD_01_01_FIRSTNAME" size="15" maxlength="60"></td>
        <td bgcolor="#e9e9e9"><input type="text" name="FIELD_01_02_MIDDLENAME" size="15" maxlength="60"></td>
        <td align="left" bgcolor="#e9e9e9"><input type="text" name="FIELD_01_03_LASTNAME" size="15" maxlength="60"></td>
      </tr>
      <tr>
        <td colspan="3" bgcolor="#e9e9e9"><input type="text" name="FIELD_01_07_ADDRESS1" size="50" value="" maxlength="200"></td>
        <td align="left" bgcolor="#e9e9e9"><input name="FIELD_01_04_BDAY" type="text" size="15" maxlength="15"></td>
      </tr>
       </form>

document.getElementsByTagName'YOUR_NAME_HERE'[0]

应该能够为您获取元素。

有两种方法：

var list = document.querySelector("input");
var list = document.querySelectorAll("input")[0];
var list = document.getElementsByTagName("input")[0];

补遗 querySelector更灵活，因为它可以像jQuery一样接受任何有效的css选择器。如果需要获取具有特定名称的输入元素，这非常方便：

var firstName = document.querySelector("input[name='firstName']");

var namedInputs = document.querySelectorAll("input[name]");

第二次编辑。。。 如果不想键入太多，可以为querySelector创建别名：

window.get = document.querySelector.bind(document);

var firstname = get("[name='FIELD_01_01_FIRSTNAME']").value;
var lastname = get("[name='FIELD_01_02_MIDDLENAME']").value;
//etc...

第三次编辑。。。 如果在中有元素，则可以使用表单名称+dom导航输入的名称：

HTML
<form name='test">
    <input type="text" name="firstName" value="James" />
</form>


//javascript
alert( test.firstName.value );

如果您想看到此方法的演示，请尝试此提琴：

---

这里需要注意的是，您没有名为test的局部变量。如果您想明确地引用全局测试，可以使用window.test来代替。

这个问题确实需要重新措辞/更多的解释来说明要做什么

document.querySelectorAll('input[name]');

这将选择具有name属性的所有输入元素，然后可以对其进行迭代

或

将为您提供特定输入元素的标记名

---

但是如上所述，我不理解这个问题，我不确定这是否有帮助。

将所有输入的CSS选择器放在逗号分隔的字符串中，然后运行：

---

等等。

很多关于标签的答案，但这里有另一种方法。如果元素在表单中，它们也将作为表单及其元素集合的命名属性提供，例如

<form id="f0">
  <table>
    <tr>
      <td><input type="text" name="FIELD_01_01_FIRSTNAME"></td>
      <td><input type="text" name="FIELD_01_02_MIDDLENAME"></td>
      <td><input type="text" name="FIELD_01_03_LASTNAME"></td>
    </tr>
    <tr>
      <td><input type="text" name="FIELD_01_07_ADDRESS1"></td>
      <td><input name="FIELD_01_04_BDAY" type="text"></td>
    </tr>
  </table>
</form>

然后按名称获取控件：

var firstName = form.FIELD_01_01_FIRSTNAME.value;    // or
var firstName = form['FIELD_01_01_FIRSTNAME'].value;

请注意，如果两个或多个控件具有相同的名称，则上面的命令将返回控件的名称

以及使用元素：

var allControls = form.elements;

返回具有给定标记名的元素的HTMLCollection。将搜索整个文档，包括根节点。返回的HTMLCollection是活动的，这意味着它会自动更新自身以与DOM树保持同步，而无需再次调用document.getElementsByTagName

---

有关更多信息，请访问：

var elements=document.getElementsByTagname标记名

我应该对每个名字重复这个吗？所以我将重复这个var firstName=document.querySelectorinput[name='firstName']；为每个输入标记定义自己的名称？好吧，是的，但如果您担心键入，还可以为document.querySelector:var get=document.querySelector.binddocument；创建别名；。然后，您可以使用get[name=FIELD\u 01\u 01\u FIRSTNAME].value.Fair。跟随也许这会帮助您了解发生了什么。我将重复此文档。getElementsByTagName'input'[0]。getAttribute'name'；对于我想要获取元素的输入标记？通过查看其他答案，James使用querySelector'input[name=firstname]给出的第一个答案；看来是你最好的选择。是的，你会把它用于你想要得到的每一个输入。如果您试图获取所有输入，您可以获取输入标签并循环所有输入，但我不确定在获取输入名称属性后您试图做什么，因此这可能是毫无意义的。确实需要更多信息来真正回答您的问题。您能给我一个真实的示例吗？

<form id="f0">
  <table>
    <tr>
      <td><input type="text" name="FIELD_01_01_FIRSTNAME"></td>
      <td><input type="text" name="FIELD_01_02_MIDDLENAME"></td>
      <td><input type="text" name="FIELD_01_03_LASTNAME"></td>
    </tr>
    <tr>
      <td><input type="text" name="FIELD_01_07_ADDRESS1"></td>
      <td><input name="FIELD_01_04_BDAY" type="text"></td>
    </tr>
  </table>
</form>

var form = document.getElementById('f0');  // or
var form = document.forms[0];              // or
var form = document.forms.f0;

var firstName = form.FIELD_01_01_FIRSTNAME.value;    // or
var firstName = form['FIELD_01_01_FIRSTNAME'].value;

var allControls = form.elements;

var elements = document.getElementsByTagName(name);