关键词

document.getElementById的一些细节

当我们在JavaScript中使用DOM操作时,document.getElementById方法是最基本且常用的方法之一,主要用于通过元素的ID获取该元素对象。

下面是一些document.getElementById的细节:

获取不存在的ID时返回null

当我们使用document.getElementById获取ID并且此ID不存在的时候,该方法会返回null,因此,在后续操作中我们应当判断获取到的元素对象是否为null,以避免出现Undefined之类的错误。

let elem = document.getElementById("notExist");
if(elem !== null){
    //进行后续操作
}

ID命名不能以数字开头

如果我们给元素ID起的名字以数字开头,则其会被视作非法的ID,即使你在代码里使用了该ID并且能正常获取元素对象,但是我们一直都应该遵守规范命名。

获取动态添加的元素

我们可以在JavaScript代码中动态的添加元素,但是这些元素一开始是不存在于文档中的,此时如果我们使用document.getElementById方法去获取,返回值也是null。为了正常访问这些元素,我们可以使用document.querySelector方法或者在添加元素时就分配一个ID。

//方法一
let elem = document.querySelector("#dynamicElem");
if(elem !== null){
    //进行后续操作
}

//方法二
let newElem = document.createElement("div");
newElem.id = "newElemID";
document.body.appendChild(newElem);

let elem = document.getElementById("newElemID");
if(elem !== null){
    //进行后续操作
}

总之,document.getElementById方法是DOM操作中经常使用的方法之一,但是在使用过程中我们也应该注意到上述细节,以免出现错误。

本文链接:http://task.lmcjl.com/news/9737.html

展开阅读全文