getElementById(), getElementsByName()与getElementsByTagName()的用法比较！
<%@ page language="java" contentType="text/html" pageEncoding="utf-8"%>
<html>
<head>
<title>Login title here</title>
</head>
<body>
<form id ="form1" action="test.do" method="post">
<input type="text" name="a" value="1">
<br>
<input type="text" name="a" value="2">
<br>
<input type="text" name="a" value="3">
<br>
<input type="submit" value="提交">
</form>
</body>
<script type="text/javascript">
document.getElementById('form1').onsubmit=function(){
var as=document.getElementsByName('a');
for(i=0;i<as.length;i++){
alert(as[i].value);
}
}
</script>
</html>
//==================上面的是HTML与JS把分离的代码（怎么样不用onclick 来触发submit按钮的书写过程）！可以把js代码写在form上面吗？
<%@ page language="java" contentType="text/html" pageEncoding="utf-8"%>
<html>
<head>
<title>Login title here</title>
</head>
<script type="text/javascript">
function put(){
//下面是根据id拿值
// var a1=document.getElementById("e").value;
//alert(a1)
//下面是根据Name拿值，拿的是一个集合数组
// var as=document.getElementsByName('a');
// for(i=0;i<as.length;i++){
// alert(as[i].value);
//下面是根据tagName拿值,也是拿的一个数组
var as=document.getElementsByTagName("input");
for(i=0;i<as.length;i++){
alert(as[i].value);
}
}
</script>
<body>
<form id ="form1" action="test.do" method="post">
<input id="e" type="text" name="a" value="1">
<br>
<input type="text" name="a" value="2">
<br>
<input type="text" name="a" value="3">
<br>
<input type="submit" value="提交" onclick="put();">
</form>
</body>
</html>
下面是别人总结的：
http://hi.baidu.com/notebook034/blog/item/567bcffe2a3dfa345c6008c8.html
分享到：
相关推荐
本文将探讨`document.getElementsByName`和`document.getElementById`这两个DOM操作方法在Internet Explorer（IE）与Firefox（FF）中的不同实现，以及这对开发者的影响。 `document.getElementsByName`这个方法是...
然而，需要注意的是，`document.all`在标准浏览器中可能不受支持，因此在实际项目中，更推荐使用`document.getElementById`、`document.getElementsByName`等标准方法来访问DOM元素，以确保代码的兼容性和可维护性。
此外，`document`对象还有许多其他属性和方法，如`document.forms`用于访问表单，`document.images`用于访问图像，以及`document.getElementsByName()`和`getElementsByTagName()`方法用于按名称或标签名查找元素。...
本文将深入探讨`document.all`与`getElementById`、`getElementsByName`、`getElementsByTagName`这四个方法的区别和用法。 1. `document.all` `document.all` 是一个数组集合，它包含了HTML文档中所有的元素，...
值得注意的是，尽管`<span>`标签本身并不包含`name`和`value`属性，但`document.getElementsByName`仍然可以使用，它会尝试寻找具有相同`id`的元素，并返回它们的`value`属性。这意味着，即使某些元素不遵循标准，`...
getElementsByName方法是Document对象的一个方法，它返回文档中所有具有指定name属性的元素组成的HTMLCollection集合。它通常用于获取表单元素，如input或button，或者用于获取具有特定name属性的其他元素。 #### ...
如何使用`document.getElementsByName()`方法 由于`document.getElementsByName()`返回的是一个NodeList对象，因此在实际应用中，通常会使用索引 `[0]` 来访问第一个匹配的元素。例如： ```javascript var t1 = ...
`Document:getElementsByName()` 是一个在JavaScript中广泛使用的DOM（Document Object Model）方法，它允许开发者根据元素的`name`属性来查找并返回一个包含所有匹配元素的NodeList集合。这个方法对于处理HTML表单...
`document.all`、`getElementById`、`getElementsByName`以及`getElementsByTagName`都是JavaScript中用于选取HTML元素的函数，但它们各自有不同的特性和使用场景。下面我们将详细讨论这些方法的区别，尤其是`...
JavaScript 中 document 对象用法小结 JavaScript 中的 document 对象是一个非常重要的对象，它提供了大量的属性和方法来操作 HTML 文档。下面是对 document 对象的一些常用属性和方法的总结。 属性 1. `document...
### JavaScript Document 对象详解 #### 一、Document 对象简介 在Web开发中，`document`对象是浏览器提供的一种能够操作HTML文档的方式。...掌握这些API的使用方法对于提高Web开发效率具有重要意义。
但请注意，这种方法在非IE浏览器中不适用，应该使用`document.getElementsByName("name")[index]`。 3. **推荐的替代方法**：为了避免兼容性和错误问题，建议使用标准的DOM方法。例如，使用`document....
4. `document.getElementsByName(Name)`: 根据Name属性值查找所有匹配的元素，返回一个NodeList集合。 5. `document.body.appendChild(oTag)`: 将一个元素添加到`<body>`元素的末尾。 6. `document.body`: 访问`...
如果不在表单内，`inputName` 可能能直接引用，否则就要借助 `document.getElementById` 或 `document.getElementsByName`。 此外，对于具有ID的元素，如 `<div id="aa">`，我们通常使用 `document.getElementById...
- `document.getElementsByName(Name)`: 根据指定的name属性值查找并返回一组元素对象。 - `document.body.appendChild(oTag)`: 向`<body>`元素添加一个新的子元素。 3. **body对象** - `document.body`: 表示...
- `document.getElementsByName`: 获取具有相同NAME属性的所有元素。 - `document.getElementsByTagName`: 获取具有相同标签名的所有元素。 - `querySelector`和`querySelectorAll`: 提供更强大的选择器功能，类似于...
除了上述内容，`Document`对象还有其他很多功能，例如`document.getElementsByTagName()`, `document.getElementsByName()`, `document.querySelector()`, `document.querySelectorAll()`等，它们允许我们根据标签名...