form.getElementsByName 不是一个函数,但是 document.getElementsByName 是
form.getElementsByName is not a function, but document.getElementsByName is
第一个示例(type="button"
是故意的)应该有效:
<form class="needs-submission">
<input type="hidden" name="id" value="1">
<input type="text" name="name">
<input type="button" name="save" value="Save Changes" onclick="saveChanges(this.closest('.needs-submission'))">
</form>
function saveChanges(form) {
const id = document.getElementsByName('id')[0]
const name = document.getElementsByName('name')[0]
const save = document.getElementsByName('save')[0]
}
但是,当我想从form
而不是整个document
的角度select同一个字段时,form.getElementsByName
不被识别为一个函数.
function saveChanges(form) {
const id = form.getElementsByName('id')[0]
const name = form.getElementsByName('name')[0]
const save = form.getElementsByName('save')[0]
}
Uncaught TypeError: form.getElementsByName is not a function
at saveChanges
at HTMLInputElement.onclick
但是 form.getElementsByTagName
似乎工作正常?
function saveChanges(form) {
const id = form.getElementsByTagName('input')[0]
const name = form.getElementsByTagName('input')[1]
const save = form.getElementsByTagName('input')[2]
}
我的问题是:为什么我不能通过 name
属性获取字段? document
和 form
有不同的数据类型吗?
根据 MDN,getElementsByName 是 Document 对象的函数(因此它只存在于全局文档对象,而不是每个 HTML 元素):https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByName
作为解决方法,您可以使用查询选择器来查找元素,如下所示:
const name = form.querySelector("input[name='name']");
第一个示例(type="button"
是故意的)应该有效:
<form class="needs-submission">
<input type="hidden" name="id" value="1">
<input type="text" name="name">
<input type="button" name="save" value="Save Changes" onclick="saveChanges(this.closest('.needs-submission'))">
</form>
function saveChanges(form) {
const id = document.getElementsByName('id')[0]
const name = document.getElementsByName('name')[0]
const save = document.getElementsByName('save')[0]
}
但是,当我想从form
而不是整个document
的角度select同一个字段时,form.getElementsByName
不被识别为一个函数.
function saveChanges(form) {
const id = form.getElementsByName('id')[0]
const name = form.getElementsByName('name')[0]
const save = form.getElementsByName('save')[0]
}
Uncaught TypeError: form.getElementsByName is not a function
at saveChanges
at HTMLInputElement.onclick
但是 form.getElementsByTagName
似乎工作正常?
function saveChanges(form) {
const id = form.getElementsByTagName('input')[0]
const name = form.getElementsByTagName('input')[1]
const save = form.getElementsByTagName('input')[2]
}
我的问题是:为什么我不能通过 name
属性获取字段? document
和 form
有不同的数据类型吗?
根据 MDN,getElementsByName 是 Document 对象的函数(因此它只存在于全局文档对象,而不是每个 HTML 元素):https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByName
作为解决方法,您可以使用查询选择器来查找元素,如下所示:
const name = form.querySelector("input[name='name']");