如何在“添加产品页面”WooCommerce 中显示相关属性

Question

我有很多类别和属性，为了更容易找到它们，我创建了一个下拉选项。我只想展示任何主要类别中的相关产品。正如您在第一张图片和第二张图片中看到的，我创建了一个下拉选项来显示相关类别。 每当我选择一个类别时，只会出现相关的子类别。在属性的情况下，由于它们只包含值而不包含类或 id，有没有办法只显示基于所选选项的相关属性。您可以在图 3 中看到属性部分。

我使用以下代码来隐藏和显示类别。

document.getElementById("product_cat-55").style.display = "none";
document.getElementById("product_cat-56").style.display = "none";
document.getElementById("product_cat-57").style.display = "none";
document.getElementById("product_cat-58").style.display = "none";
document.getElementById("product_cat-59").style.display = "none";
document.getElementById("product_cat-60").style.display = "none";
document.getElementById("product_cat-61").style.display = "none";
document.getElementById("product_cat-62").style.display = "none";
document.getElementById("product_cat-274").style.display = "none";
document.getElementById("product_cat-206").style.display = "none";

jQuery(function($) {

    $('#custom_text_field_title_primary_category').change(function(){
        $('#product_cat-15').hide();
        $('#product_cat-55').hide();
        $('#product_cat-56').hide();
        $('#product_cat-57').hide();
        $('#product_cat-58').hide();
        $('#product_cat-59').hide();
        $('#product_cat-60').hide();
        $('#product_cat-61').hide();
        $('#product_cat-62').hide();
        $('#product_cat-274 ').hide();
        $('#product_cat-206 ').hide();
        $('#product_cat-' + $(this).val()).show();
    });
    
});