使用querySelectAll给元素设置样式

最新推荐文章于 2024-08-28 15:04:49 发布

前端_jun

最新推荐文章于 2024-08-28 15:04:49 发布

阅读量2.3k

点赞数 1

分类专栏： js 文章标签：前端 javascript

本文链接：https://blog.csdn.net/weixin_44462233/article/details/122441528

版权

js 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

该笔记应用场景：全局定义的header 和footer 样式浮在弹窗的黑色阴影上,使用querySelectAll改变元素的display/zIndex
MDN 链接：
https://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelectorAll

showRecommend(val){
			let headerDom = document.querySelectorAll('.fix-header'),
				footerDom = document.querySelectorAll('.fix-footer');
			debugger;
			if (val) {
				if (footerDom && footerDom.length) {
					for (const n of headerDom) {
						n.style.zIndex = 0
					}
					for (const n of footerDom) {
						n.style.display = 'none'
					}
				}
			}else{
				if (footerDom && footerDom.length) {
					for (const n of headerDom) {
						n.style.zIndex = 9
					}
					for (const n of footerDom) {
						n.style.display = 'flex'
					}
				}
			}
		}