JavaScript 中 getElementById 函数的用法

getElementById 是 JavaScript 中的一个非常基础且常用的 DOM（Document Object Model，文档对象模型）操作方法。它用于访问和操作 HTML 或 XML 文档中的特定元素。通过元素的 ID 来获取该元素，并返回一个指向该元素的引用。如果文档中没有具有指定 ID 的元素，则返回 null。

语法

var element = document.getElementById(id);

• id 是一个字符串，表示要获取的元素的 ID。
• element 是一个对象，代表具有指定 ID 的元素。如果找不到该元素，则为 null。

示例

假设你有以下 HTML 代码：

<div id="unique">Hello, world!</div>

你可以使用 getElementById 来获取这个 div 元素，并对其进行操作，比如改变它的文本内容：

// 获取元素
var elem = document.getElementById("unique");

// 检查元素是否存在
if (elem) {
  // 改变元素的文本内容
  elem.textContent = "Hello, JavaScript!";
} else {
  console.log("Element not found.");
}

在这个例子中，我们首先使用 getElementById 方法并传入 "unique" 作为参数，来获取 ID 为 "unique" 的元素。然后，我们检查返回的元素是否存在（即不是 null），如果存在，则将其文本内容更改为 "Hello, JavaScript!"。

注意事项

• ID 在一个 HTML 文档中应该是唯一的。如果尝试使用 getElementById 来获取一个重复的 ID，它将只返回第一个匹配的元素。
• getElementById 方法是大小写敏感的。这意味着在调用它时，必须精确匹配元素的 ID（包括大小写）。
• 获取到的元素可以是一个 HTML 元素（如 <div>、<span> 等），也可以是一个 SVG 元素或任何其他类型的 DOM 元素。一旦获取到元素，就可以使用 JavaScript 来读取或修改其属性、样式或内容。