1、定义：
getElementById(id)，以id标识符取得对象，是一个对象;
getElementsByName(name)，以name取得节点清单，是一个数组集合;
getElementsByTagName(tagname)，返回带有指定标签名的对象的集合.
2、一个文件中id是唯一的，但是name可以重名(比如radio)， 所以，getElementById获得的是单个对象，用getElementById("id")直接访问， 而getElementsByName获得的结果以数组形式表示，访问getElementsByName获得的对象的方法是getElementsByName("name")[i]。访问哪个标签对象用getElementsByTagName("tagName")[i],注意getElementsByTagName的字符串可以不区分大小写。
3、比如有两个DIV：
<div name="docname" id="docid1"></div>
<div name="docname" id="docid2"></div>
那么可以用getElementsByName("docname")获得这两个DIV，用getElementsByName("docname")[0]访问第一个DIV对象，用getElementsByName")[1]访问第二个DIV对象。具体访问哪个对象还有用getElementById("docid1");
4,例子
(1)
<html>
<head>
<script>
function idfun1(){
var v = document.getElementById("divOne");
v.innerText="linjianqinghao"; //写入信息
}
function idfun2(){
var v = document.getElementById("divOne");
v.innerText="you are very good"; //写入信息
}
</script>
</head>
<body>
</body>
<input type="button" value="显示信息1" onclick="idfun1()"> <!--换成图片可以制作菜单-->
<input type="button" value="显示信息2" onclick="idfun2()"><br><br>
<div id="divOne" style="width:100,height:100"></div>
</html>
(2)
<html>
<head>
<script>
function namefun() {
var s = document.getElementsByName("sex");
for(var i=0;i<s.length;i++) {
if(s[i].checked) { //选中发生的事件
alert(s[i].value);
}
}
}
</script>
</head>
<body>
<form>
<table>
<tr>
<td><input type="radio" name="sex" value="0" id="s0" onclick="namefun()">男</td>
<td><input type="radio" name="sex" value="1" id="s1" onclick="namefun()">女</td>
</tr>
</table>
</form>
</body>
</html>
(3)
<html>
<head>
<script>
function tagNamefun(i) {
var s = document.getElementsByTagName("input");
s[i].value='请输入'+s[i].name;
}
</script>
</head>
<body>
<form>
<table>
<tr>
<td>用户名:<input type="text" name="username" onfocus="tagNamefun(0)"></td>
</tr>
<tr>
<td>密码:<input type="text" name="password" onfocus="tagNamefun(1)"></td>
</tr>
</table>
</form>
</body>
</html>
(4)
<html>
<head>
<script>
function keyup(obj){
var vOne = obj.value.length;
//name也有时会被视作id(如在textarea中)
// 等价于document.getElementById("txaTwo").value = vOne;
//等价于document.getElementsByName("txaTwo")[0].value = vOne;
formOne.txaTwo.value = vOne;
}
</script>
</head>
<body >
<form name="formOne">
<table>
<tr>
<td><textarea name="txaOne" onkeyup="keyup(this)"></textarea></td>
<td><textarea name="txaTwo"></textarea></td>
</tr>
</table>
</form>
</body>
</html>
分享到：
相关推荐
在HTML文档对象模型（DOM）中，有三种主要方法用于查找HTML元素：`document.all`，`getElementById()`，`getElementsByName()` 和 `getElementsByTagName()`。这些方法各有其特性和适用场景，理解它们的区别对于编写...
本文将深入探讨`document.all`与`getElementById`、`getElementsByName`、`getElementsByTagName`这四个方法的区别和用法。 1. `document.all` `document.all` 是一个数组集合，它包含了HTML文档中所有的元素，...
现在更推荐使用具有唯一性的ID属性，并用document.getElementById()来获取单个元素，或者使用querySelector()和querySelectorAll()这些更现代的方法来获取元素，这些方法允许通过CSS选择器来获取元素，提供更大的...
本篇将详细讲解DOM中的三个核心方法：`getElementById`、`getElementsByTagName`以及`getElementsByName`，这些都是JavaScript与网页元素交互时常用的方法。 首先，`getElementById`是DOM中查找特定ID元素的最直接...
与 `getElementById()` 方法不同，后者通过元素的唯一 `id` 查找单个元素，而 `getElementsByName()` 返回的是一个包含所有匹配 `name` 的元素的 **NodeList 集合**，而不是单个元素。由于在 HTML 中，多个元素可以...
在DOM中，有几种重要的方法用于操作和访问页面元素，其中`getElementById()`、`getElementsByName()`和`getElementsByTagName()`是JavaScript中常见的三种。下面我们将详细探讨这些方法以及它们在DHTML（Dynamic ...
以上介绍了几种常见的 JavaScript 获取 HTML 元素的方法：`getElementById`、`getElementsByName`、`getElementsByTagName` 和 `document.all`。每种方法都有其适用场景和特点，在实际开发中应根据具体需求选择合适...
1. 使用getElementById()方法进行通过Id查询： getElementById()方法用于通过元素的ID来获取对应元素。每个HTML元素可以设置一个唯一的ID标识，通过这个ID可以准确地定位到特定的元素。例如： ```javascript var btn...
IE中`parentNode`和`childNodes`的使用与Firefox基本一致，但在处理子节点集合时，Firefox提供了更强大的`getElementsByTagName`方法，而IE中的`childNodes`可能包含文本节点和其他非元素节点，这在处理时需额外注意...
标准的访问方式是使用`document.getElementById`、`document.getElementsByName`和`document.getElementsByTagName`等方法。例如，使用`document.getElementById('id')`来替代`document.all.id`。 2. 集合类对象...
1. **通过ID获取元素**：这是最直接的方法，`getElementById()`函数接受一个字符串参数，这个字符串是元素的ID。例如： ```javascript var city = document.getElementById("city"); ``` 这将返回页面中ID为...
注意，`document`对象支持以上四种方法，而`element`对象只支持`getElementsByTagName`和`getElementsByClassName`。 ### 修改DOM元素 - 修改内容：可以使用`innerText`或`innerHTML`属性。`innerText`仅仅是普通...
2、getElementsByName()方法：通过name取得元素，是一个数组。 3、getElementsByTagName()方法：通过HTML标签取得元素，是一个数组。 如果要取得值可以使用value，如：var x=document.getElementById(“id”).value;...
在这些方法中，最为人们熟悉且常用的选择器包括：getElementById、getElementsByName、getElementsByTagName 和 getElementsByClassName。这些方法能够帮助开发者以不同的属性或标签名来获取页面元素。 ...
例如，先通过`getElementById`找到一个父节点，然后使用`getElementsByTagName`或`children`来筛选出特定类型的子元素，最后利用`previousSibling`或`nextSibling`找到目标元素。 了解并熟练掌握这些DOM操作方法，...
24. DOM方法，如getElementById和getElementsByName，分别用于获取ID唯一和名称相同的元素集合。 25. 对象和属性的识别，如id、name、value等，是HTML元素常见的属性。 这些知识点涵盖了JavaScript的基本语法、DOM...
注意：`getElementsByTagName()` 和 `getElementsByName()` 的区别在于前者是基于标签名进行搜索，而后者则是基于元素的`name`属性。 ##### 4. `hasChildNodes()` 此方法用于检测一个元素是否包含子节点。如果存在...