HTMLSpanElement（和其他）有什么用

Question

我正在学习 JavaScript。

\n\n

var label = document.getElementById('lblMsg');\n

\n\n

如果我使用 F12 检查该元素，它被描述为 HTMLSpanElement。我无法将元素转换为其类型，例如：

\n\n

var label = (HTMLSpanElement) document.getElementById('lblMsg');\n

\n\n

那么 HTMLSpanElement 有什么用呢？它是否具有与其他 HTMLElements 不同的属性 diff\xc3\xa9rent ？

\n

Answer 1

由于您是初学者，我将指出一些基本事实，这些事实可能会帮助您理解所观察到的内容。

JavaScript 是弱类型的

JavaScript 中的对象确实有类型，但变量没有类型，即任何变量都可以采用任何类型的任何对象。类型转换不是必需的，也不可能（事实上，该行(HTMLSpanElement) document.getElementById('lblMsg')是语法错误）。

HTML 元素类型

HTMLSpanElement是一种类型。嗯，不是真的。它是一个 DOM 接口，为了方便起见，所有现代浏览器都将其视为本机对象类型。大多数 HTML 元素都有其主界面的类型。

接口的要点是公开一组可供所有实现使用的方法、属性或事件。您已经拥有以下 MDN 链接HTMLSpanElement：https://developer.mozilla.org/en-US/docs/Web/API/HTMLSpanElement。

测试类型

要测试一个对象是否是特定类型的实例，我们可以使用obj instanceof Type. 在这种情况下：

if (document.getElementById('lblMsg') instanceof HTMLSpanElement)
{
    ...
}

类型继承始终受到尊重。

document.getElementById('lblMsg') instanceof Object // true

获取对象的类型

要获取 HTML 元素的类型，我们使用element.constructor, 如

document.getElementById('lblMsg').constructor

如果您在浏览器控制台中输入此内容，您将看到类似的内容

`function HTMLSpanElement() { [native code] }`

不要感到惊讶。对象类型是 JavaScript 中的函数。如果我们只对该对象类型的名称感兴趣，我们可以使用

document.getElementById('lblMsg').constructor.name

这会产生字符串"HTMLSpanElement"

这种确定对象类型的方法并不是 100% 万无一失，但它适用于所有内置对象。