我有以下 HTML:
<!DOCTYPE html>
<html>
<head>
<title>JavaScript & jQuery - Chapter 13: Form Enhancement and Validation - Select All Checkboxes</title>
<link rel="stylesheet" href="css/c13.css" />
</head>
<body>
<div class="container login">
<form id="interests" action="/login" method="post">
<div class="one-third column">
<img src="img/logo.png" alt="logo" id="logo" />
</div>
<div class="two-thirds column" id="main">
<fieldset>
<legend>Genres</legend>
<label><input type="checkbox" value="all" id="all">All</label>
<label><input type="checkbox" name="genre" value="animation">Animation</label>
<label><input type="checkbox" name="genre" value="docs">Documentary</label>
<label><input type="checkbox" name="genre" value="shorts">Shorts</label>
</fieldset>
</div><!-- .two-thirds -->
</form>
</div><!-- .container -->
<script src="js/utilities.js"></script>
<script src="js/all-checkboxes.js"></script>
</body>
在 all-checkbox.js 文件中，我有以下几行:
...
var form = document.getElementById('interests');
var elements = form.elements;
...
当我加载页面并检查调试器 (Firefox) 中的元素变量时，我看到它是一个长度为 5 的数组。我的理解是 form.elements 将返回表单的所有元素。调试器显示元素的以下值:
0: <fieldset>
1: <input#all>
2: <input>
3: <input>
4: <input>
本来以为legend元素也是表单元素，但是这里显然不算。
谁能教教我？
最佳答案
getElementById 返回 HTMLFormElement目的。 图例 不是 listed element在elements它的属性(property)。
至于为什么……/耸耸肩。我似乎找不到任何背景故事。不过，如果我不得不猜测的话，我会说是因为它不是表单的实际控制元素，也许感觉 HTMLFORMElement.elements 的力量意味着“控制”元素。但同样，只是猜测。
关于HTML 图例元素未计算在表单中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30134853/