当slick-initialized子div不存在时，如何隐藏父div？现有代码是否正确？

现有JavaScript代码不正确，主要存在以下问题：

1. 方法使用错误 #

document.getElementsByClassName()的参数只能是类名字符串（多个类名用空格分隔时，表示同时拥有这些类的元素），无法识别#product-recommender-recipe > .slick-initialized这类完整CSS选择器，因此这行代码无法正确获取目标元素。

2. 逻辑执行失效 #

你的需求是检查ID为product-recommender-recipe的父容器内是否存在class="slick-initialized"的子元素，但由于方法使用错误，现有代码根本无法完成这个判断逻辑。

正确代码实现 #

可以使用支持完整CSS选择器语法的querySelector()或querySelectorAll()来实现需求，以下是两种可行方案：

方案一：直接用选择器判断 #

// 查找父元素下的目标子元素
var targetElement = document.querySelector('#product-recommender-recipe > .slick-initialized');
// 若子元素不存在，则隐藏父元素
if (!targetElement) {
    document.getElementById('product-recommender-recipe').style.display = 'none';
}

方案二：先获取父元素再检查子元素 #

var parentEl = document.getElementById('product-recommender-recipe');
var slickEl = parentEl.querySelector('.slick-initialized');
if (!slickEl) {
    parentEl.style.display = 'none';
}

两种方案都能准确实现需求：当product-recommender-recipe内部没有slick-initialized类的子元素时，将父元素设置为display: none。

内容的提问来源于stack exchange，提问作者Schneider G