Question

为什么在这种情况下：

var ele = <HTMLDivElement>document.getElementById("toolbar");
    ele.addEventListener("click", function (e) { 
        if (e.target.tagName === "SPAN") { console.log(e.target.tagName) }  }, false);

Visual Studio向我显示此错误？

构建：运营商＆＃39; ===＆＃39;不能应用于类型＆＃39; HTMLElement＆＃39;和   ＆＃39;串＆＃39;

Property＆＃39; tagName＆＃39;类型＆＃39; EventTarget＆＃39;。
上不存在

当我运行脚本时工作正常。

如何正确编写？

谢谢。

Answer 1

我会像这样调整代码片段：

var ele = <HTMLDivElement>document.getElementById("toolbar");
    ele.addEventListener("click", (ev: MouseEvent) => {
        var element = ev.target as HTMLElement;     
        if (element.tagName === "SPAN") { 
            console.log(element.tagName) 
        }  
    }, false);

将事件属性target投射到HTMLElement将为我们提供基础元素的所有适当属性。

在the playground

中查看

Answer 2

我发现此语法也可以正常工作

if ((ev.target as HTMLElement).tagName === "SPAN") {

Answer 3

两个等号将（int =='string'）类型（即19 =='19'）之间的值比较为真。

3个等号是比较价值和类型。所以你要将字符串类型与HTML类型进行比较。因此等于虚假。如果要将tagname元素与字符串进行比较，请使用两个等号

Answer 4

在Angular中，如果tagName属性在目标上给出错误，请尝试使用下面的代码

event.target['tagName']

打字稿：如何检查eventTarget中的tagName？

4 个答案: