JavaScript 中的 document.getElementById() 使用方法

document.getElementById() 方法详解 document.getElementById() 是一个常用的 JavaScript 方法，用于获取 HTML 文档中具有特定 ID 的元素。该方法返回一个 Element 对象，该对象是 HTML 元素的表示形式。下面，我们将详细介绍 document.getElementById() 方法的使用方法和相关知识点。 语法 document.getElementById(id) 参数 * id：字符串，表示要获取的元素的 ID。 返回值 Element 对象，表示具有特定 ID 的 HTML 元素。如果不存在具有该 ID 的元素，则返回 null。 使用方法 获取元素：document.getElementById(" elemID ") 其中，"elemID" 是要获取的元素的 ID。 示例 ``` <input type="text" id="button1" value="Click Me" /> ``` 获取上面的输入框元素： ``` document.getElementById("button1").value ``` 知识点 1. document.getElementById() 方法只能获取具有 ID 的元素，如果元素没有 ID，则无法获取。 2. 该方法返回一个 Element 对象，可以使用该对象的属性和方法来操作元素。 3. 使用 document.getElementById() 方法可以获取各种类型的 HTML 元素，如输入框、按钮、div、span 等。 4. 可以使用 document.getElementById() 方法来动态改变元素的内容或样式。 5. 在 JavaScript 中，可以使用 document.getElementById() 方法来获取元素，然后使用该元素的方法和属性来实现各种交互效果。 示例代码 ``` function setElemTxt(t) { document.getElementById("elem").innerHTML = t; } function setElemStyle(color, size) { document.getElementById("elem").style.color = color; document.getElementById("elem").style.fontSize = size; } ``` 上面的代码中，我们使用 document.getElementById() 方法来获取一个 ID 为 "elem" 的元素，然后使用该元素的 innerHTML 属性和 style 属性来改变元素的内容和样式。 注意 在使用 document.getElementById() 方法时，需要确保元素的 ID 是唯一的，以免获取到错误的元素。 相关知识点 * Element 对象：表示 HTML 元素的对象，提供了许多属性和方法来操作元素。 * innerHTML 属性：用于获取或设置元素的 HTML 内容。 * style 属性：用于获取或设置元素的样式。 * JavaScript 事件：可以使用 document.getElementById() 方法来获取元素，然后使用该元素的事件来实现交互效果。 document.getElementById() 方法是一个非常有用的 JavaScript 方法，用于获取 HTML 元素，可以用来实现各种交互效果和动态改变元素的内容或样式。