时间戳

首页 > 解决方案 > 跨度类的Js变量在if语句中未定义

javascript - 跨度类的Js变量在if语句中未定义

问题描述

这是我的整个js代码：

var htmlLang = document.documentElement.getAttribute("lang");
var en = document.getElementsByClassName("en");
var es = document.getElementsByClassName("es");

if(htmlLang == "en"){
    es.style.display = "none";
} else if(htmlLang == "es"){
    en.style.display = "none";
}

以下是我要修改的 HTML 元素：

<td><a href='register.php'><span class='en'>Register</span><span class='es'>Registrar</span></a></td>
<td><a href='about.php'><span class='en'>About Me</span><span class='es'>Sobre mi</span></a></td>
<td><a href='login.php'><span class='en'>Log In</span><span class='es'>Iniciar sesi&otilde;n</span></a></td>

当我启动页面时，我收到错误：

Uncaught TypeError: Cannot set property 'display' of undefined at main.js:6 < which is at the "es.style ..." in the js.

对我来说，一切看起来都是正确的，我认为它与范围有关，但是将整个变量（document.getElements ...）放在 if 语句中我得到了同样的错误。

感谢任何能提供帮助的人！

标签： javascripthtmlif-statement

解决方案

当您选择项目时，document.getElementByClassName您将获得所有找到的元素的集合列表，因此您将无法更改其样式。所以将其转换为数组Array.from(document.getElementByClassName("es"))

这是我所做的工作编辑：

var htmlLang = document.documentElement.getAttribute("lang");
var en = Array.from(document.getElementsByClassName("en"));
var es = Array.from(document.getElementsByClassName("es"));


if(htmlLang == "en"){
    es.forEach(e => {
      e.style.display = "none"
    })
} else if(htmlLang == "es"){
    es.forEach(e => {
      e.style.display = "none"
    })
}

推荐阅读