原生js方式控制元素显示隐藏代码

整设计 0 赞 (0) 126字  预计1分钟 67

在网页中,有时候我们需要隐藏某个内容如div,那就需要让这个元素隐藏或显示。这样的网页效果,其实通过原生JS即可实现。
原生JS控制元素显示隐藏代码,如下:

var obox = document.getElementById("logo");
var odown = document.getElementById("side-item");
obox.onclick = function(){
if( document.getElementById("side-item").style.display=='none'){
odown.style.display = "block";
document.getElementById("logo").classList.add("no");
}else{
odown.style.display = "none";
document.getElementById("logo").classList.remove("no");
}
}

简要说明一下:logo是点击触发的元素,side-item是需要显示隐藏的元素,no是触发事件后给logo加的样式。
只需要对着说明改ID名称就可以了。
原生js方式控制元素显示隐藏代码

如果您喜欢这篇文章,欢迎在下方留言评论哦~
发表您的看法
选择表情