使用getElementsByName()获取相同名字的元素
在JavaScript中,有时候我们需要获取HTML文档中具有相同名称的元素,这时就可以使用`getElementsByName()`方法来实现。这个方法会返回一个包含指定名称的所有元素的NodeLi
在JavaScript中,有时候我们需要获取HTML文档中具有相同名称的元素,这时就可以使用`getElementsByName()`方法来实现。这个方法会返回一个包含指定名称的所有元素的NodeList对象。接下来我们通过一个简单的示例来演示如何使用这个方法。
新建HTML文件
首先,在编辑器中新建一个HTML文件,并在其中编写以下代码:
```html
```
创建JavaScript文件
接着,在同一目录下创建一个名为`script.js`的JavaScript文件,编写以下代码:
```javascript
function getElements() {
var x ("myInput");
alert("Number of myInput elements: " x.length);
}
document.querySelector('button[name"myButton"]').addEventListener('click', getElements);
```
预览效果
保存以上两个文件,并在浏览器中打开HTML文件。你将看到三个输入框和一个按钮。当你点击按钮时,会弹出一个提示框,展示名字为`myInput`的元素个数。
通过使用`getElementsByName()`方法,我们可以轻松地获取HTML文档中具有相同名称的元素,并对它们进行操作。这在某些特定的场景下非常有用,例如表单中重复的输入框或多个具有相同名称的元素。希望本文能够帮助你更好地理解和应用这个方法。