Javascript 我试图写一个函数隐藏一个元素，显示另一个

我正试图写一个函数来重现隐藏一个元素并使另一个元素出现的动作。我知道在JQuery中有一些东西是thor的，但我还没有，所以我想用简单的js来解决它

const changeDisplay = (elm1, elm2) => {
     let E1 = document.getElementById('elm1').style.display = 'none'
     let E2 = document.getElementById('elm2').style.display = 'block'
     return elm1.addEventListener('click', E1) &&
     elm1.addEventListener('click', E2)
   }

   changeDisplay('not', 'ok')

TypeError:document.getElementById（…）是空脚本。js:6:21

这会引发一个错误，因为您没有使用语法创建函数

您正在计算document.getElementById（'elm1'）.style.display='none'i立即并将计算值分配给

E1

一项职能是：

let E1 = function () { document.getElementById('elm1').style.display = 'none' };

---

在代码段中，您试图以字符串形式访问

elm1

和

elm2

，因此应该删除

”

。你的最后一行addEventListener是可疑的，我不明白你想做什么

处理JS中样式更改时的最佳实践是预先创建CSS类，并使用JS动态更改类。诸如此类：

const changeDisplay = (elm1, elm2) => {
     const E1 = document.getElementById(elm1);
     const E2 = document.getElementById(elm2);
     E1.className = 'display_none';
     E2.className = 'display_block';
     E1.addEventListener('click', /*FUNCTION*/);
     E2.addEventListener('click', /*FUNCTION*/);
   }

   changeDisplay('not', 'ok')

---

尝试使用下面的示例代码添加或删除CSS类，这些类将根据需要隐藏或显示元素

window.onload=function（）{
var items=document.querySelectorAll（'.item'）；
对于（变量i=0；i

.hidden{display:none；}
.item{cursor:pointer；}

第1项
项目2

您希望从分配中得到什么：

document.getElementById（'elm1'）.style.display='none'

？使用JS设置元素样式、使用JS实现功能并切换CSS类以进行任何设计更改都是错误的做法。

document.getElementById（…）为null

-是否确定找到了正确的元素？在一个最简单的例子中重现您的方法。您希望从

.addEventListener

&&

.addEventListener

返回什么？请始终显示所有相关代码。在这里包括HTML和CSS。谢谢大家。css和html不是问题所在，我的id不在html中。这就是为什么我没有把它贴出来。我从答案中学到了很多，但我必须继续学习才能解决它。

const changeDisplay = (elm1, elm2) => {
     const E1 = document.getElementById(elm1);
     const E2 = document.getElementById(elm2);
     E1.className = 'display_none';
     E2.className = 'display_block';
     E1.addEventListener('click', /*FUNCTION*/);
     E2.addEventListener('click', /*FUNCTION*/);
   }

   changeDisplay('not', 'ok')