js中document.getElementById(id)的具体用法

document.getElementById(id)是一种常用的JavaScript方法，用于通过指定id获得HTML文档中的元素。在此提供了具体用法的攻略：

使用方法

在JavaScript中使用 document.getElementById(id) 时，需要指定查找的元素的id，访问到元素的方法是通过指定的id来访问。

示例代码如下：

// 指定id获取单个元素
var element = document.getElementById('example');

在上面的代码里，获取了id为“example”的HTML元素。

如果需要修改元素的内容，可以通过获取元素后设置其innerHTML属性。示例代码如下：

// 修改元素的内容
element.innerHTML = 'Hello World!';

使用 document.getElementById(id) 方法时，如果HTML文档中存在多个元素拥有相同的id，那么只会取得第一个元素。

注意点

在使用 document.getElementById(id) 方法时，有几个需要注意的点。

1. id必须唯一，如果HTML文档中的多个元素拥有相同的id，那么只会取得第一个元素。
2. 如果无法获取到指定id的元素，那么 getElementById() 将返回null。

示例

以下是两个示例，通过 document.getElementById(id) 方法获取HTML中的元素。

示例1

<div id="example">Hello World!</div>

var element = document.getElementById('example');
element.innerHTML = 'Hello World!';

在上面的示例中，获取HTML中id为“example”的元素，然后将其内容修改为“Hello World!”。

示例2

<div class="example">Hello World! 1</div>
<div class="example">Hello World! 2</div>
<div class="example">Hello World! 3</div>

var elements = document.querySelectorAll('.example');
for (var i = 0; i < elements.length; i++) {
  elements[i].innerHTML = 'New content';
}

在上面的示例中，使用了 document.querySelectorAll() 方法获取多个class名为“example”的元素。然后遍历获取到的所有元素，将它们的内容修改为“New content”。